PROMPT_013 / FORMS

DESIGN THE NOTHING.

Short, confident empty states with a single action instead of apologetic paragraphs.

BEST FOR: Saved lists, search results, new accounts.
DIFFICULTY: Easy
TOOLS: Lovable · v0

USE THIS IN LOVABLE

Design every empty state in this app with the same structure.

Layout: a faint technical grid or rule as background texture, one uppercase display statement (max 5 words), one line of supporting copy in muted gray, and exactly one primary action with an arrow.

Copy examples — no saved items: "YOUR VAULT IS EMPTY." / "Save interactions and they'll live here." / "EXPLORE EFFECTS ↗". No search results: "NOTHING MATCHES THAT VIBE." / "Try another word or remove a filter." / "CLEAR FILTERS".

Never use illustrations, mascots, or apologetic multi-sentence paragraphs.

---
Tool: Lovable. Apply the changes directly to the existing codebase, reuse the current design tokens and component structure, and do not introduce new dependencies.

RECOMMENDED INTERACTIONS.

STRUCTURE / 56PX

INTERACTION_023CSS

Tech Grid

Faint technical grid with a radial fade.

Background / LightView

INTERACTION_004CSS

Sliding Arrow

Directional arrow that translates on hover.

Buttons / LightView

RELATED PROMPTS.

All prompts

PROMPT_001 / LANDING PAGES

MAKE MY WEBSITE FEEL EXPENSIVE.

Adds restrained motion, glass surfaces, premium hover behavior, better typographic transitions and professional microinteractions.

premiumlanding-pagemicrointeraction

Preview

PROMPT_002 / LANDING PAGES

BUILD A LANDING PAGE THAT LOOKS HIRED.

A complete dark, monochrome, editorial landing page structure with asymmetric bento sections and restrained motion.

premiumlanding-pagedark-ui

Preview

PROMPT_003 / BUTTONS

GIVE MY CTA GRAVITY.

A reusable cursor-following button component with proper touch and reduced-motion fallbacks.

buttonmousepremium

Preview