Lilac Dream
Iridescent lilac haze, a whispering serif and light that seems to float.
This style
$9$19
One-time, no subscription · instant download · client use · 7-day refund before download
The idea
Pearl, lilac and peach dissolve into each other like a sky at 6am. A fine, airy serif floats in huge sizes, frosted glass cards catch the colour behind them, and buttons shimmer with the same gradient. Soft, romantic and quietly surreal.
Lilac Dream is a high-key, iridescent pastel for products sold on feeling. It draws from Pre-Raphaelite softness, 1990s holographic packaging and contemporary fragrance photography, where light itself is the subject. An aurora of lilac, pink, peach and pale blue drifts behind everything; a whisper-thin serif is set enormous and tight; cards are frosted glass that borrow colour from the sky behind. Nothing is heavy, nothing has an edge. It should feel like a dream you're trying to hold onto.
Principles
- Let the gradient be the atmosphere; never box it into a shape.
- Set the serif light and enormous — 300 weight, 160px on desktop.
- Use glass for every card so colour seeps through.
- Keep copy short; dreams don't have paragraphs.
- Move slowly and blur in, never slide.
Motion
Text and cards resolve from a 16px blur like a dream coming into focus; the aurora background slowly rotates its hue over 30 seconds, and buttons bloom a pink glow on hover.
Do & don't
Do
- ✓ Blur everything in on entrance (12–16px to 0).
- ✓ Let images feather into the canvas with a mask.
- ✓ Keep one italic word per headline, tinted pink.
Don't
- ✕ Don't use solid saturated blocks.
- ✕ Don't set any type heavier than 500.
- ✕ Don't use hard drop shadows.
+ 3 more of each, and component rules, in the full DESIGN.md.
What's in the DESIGN.md
- 01Overview & principles
- 02Colors (tokens + proportions)
- 03Typography (families + 12-role scale)
- 04Layout & spacing scale
- 05Elevation & depth
- 06Shapes & radii
- 07Motion (easing, durations, signature)
- 08Imagery + generation prompt
- 09Components (button, card, nav, input, badge)
- 10Do's and don'ts
- 11Responsive behaviour
- 12Iteration guide + agent checklist
Plus theme.css (Tailwind v4 @theme), tokens.json (W3C) and the preview page source — 371 lines of DESIGN.md in total.
More like this
All Pastel & Soft →
Butter Yellow
No. 022Sunny butter, a fat friendly grotesk and halftone dots like a cereal box.
Cloud Lavender
No. 023Pillow-soft lavender, rounded everything, and a sky that never gets dark.
Mint Sorbet
No. 025Cold mint, a chunky grotesk and stickers slapped on like a gelato cart.
Nursery Blue
No. 026Baby-blue skies, bubbly type and corners soft enough for a toddler.
Peach Fuzz
No. 027Velvety peach, a soft-bellied serif and the warmth of brushed wool.
Sunset Mesh
No. 021Golden-hour gradients, milky glass and a soft italic serif for the end of the day.