Equip your AI with taste.
A design-direction brief for Lovable, v0, Cursor, Claude, Figma — and every other builder.
- 01 Direction
- 02 Art direction
- 03 Brief ready
Three different design systems — not colour variants. Each one changes palette, type, rhythm and every control together. Picking one updates the preview and the brief instantly; you can art-direct it afterwards.
Rounded, buoyant, candy accents and spring physics.
- Generous radii and spring motion read as forgiving — it lowers the perceived cost of trying something.
- A bright accent pair keeps empty and onboarding states cheerful instead of clinical.
- Never use a dark near-black background or a hairline 1px border aesthetic.
- Never use condensed or all-caps display type.
Concrete ground, Klein-blue shock, exposed structure.
- Exposed structure signals confidence — the layout itself becomes the brand asset.
- One hyper-saturated accent on a concrete neutral produces maximum recall from minimum ornament.
- Never soften with shadows, blur, glass or gradients.
- Never use a radius above 0px anywhere.
Hairline grid, near-monochrome, type does every job.
- A single accent and a strict grid make content the only thing competing for attention — ideal when credibility matters more than spectacle.
- Monochrome plus one hue survives real content: long headlines, dense tables and user-generated copy never break the palette.
- Never add a second accent hue, gradient fill or coloured shadow.
- Never centre body copy or use decorative icon sets.
Borrow a screen from an exclusive library
A curated set of high-performing websites and apps — real shipping products. Pick a screen to seed structural intent into your brief, then tune the taste controls below to make it yours.
organic · editorial — no template aesthetic.
- Palette
- Clay + Antique
- Accent
- #e8a850
- Background
- #1c1410
- Foreground
- #f5ebd9
- Display face
- Young Serif
- Body face
- Mulish
- Type scale
- 1.25 with deliberate off-scale display sizes
- Display size
- clamp(56px, 9vw, 168px)
- Body size
- 17-18px / 1.65
- Tracking
- -0.015em,
- Spacing base
- golden-ratio spacing off a 16px base (16 / 26 / 42 / 68 / 110 / 178)
- Radius
- Sharp 0px
- Density
- Spacious
- Motion
- Considered
- Easing
- cubic-bezier(0.22, 1, 0.36, 1) at 500-700ms
- Spring
- stiffness 150, damping 22
Universal designer-grade brief — paste into any AI agent, builder, or design tool