Midnight Velvet
Indigo velvet, a lush italic serif and the glow of a stage at 11pm.
This style
$9$19
One-time, no subscription · instant download · client use · 7-day refund before download
The idea
Deep ink-blue fading into aubergine like a velvet curtain, a voluptuous high-contrast serif with sweeping italics, and soft rose-gold light pooling on glass cards. It feels like a seat near the stage of a late-night jazz room — intimate, plush and a little theatrical.
Midnight Velvet is a plush, theatrical dark system. It draws from Art Nouveau theatre programmes, 1950s jazz record sleeves and the warm intimacy of basement music rooms: an indigo-to-aubergine mesh like stage curtains, a voluptuous high-contrast serif with dramatic italics, and rose-gold light that falls on frosted glass cards. Colour is rich but low-lit — nothing is neon. Small gold stars punctuate the darkness like stage lights. It should feel romantic, intimate and a little bit glamorous.
Principles
- Light the page like a stage: one warm spot, deep shadows around it.
- Let the italic serif sing — one sweeping word per headline.
- Use glass cards so the velvet mesh glows through.
- Keep rose gold for the action; violet for atmosphere.
- Never go bright: everything should look lit by candles.
Motion
A spotlight gradient follows the cursor across the hero at 20% opacity, as if a follow-spot were tracking you; cards bloom with a rose-gold glow when hovered.
Do & don't
Do
- ✓ Tint the italic headline word rose gold.
- ✓ Add 3–5 tiny gold stars per hero, never more.
- ✓ Use glass cards only over the mesh.
Don't
- ✕ Don't use neon or electric blues.
- ✕ Don't use pure black — the darkest tone is indigo.
- ✕ Don't use rose gold for body text.
+ 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 — 370 lines of DESIGN.md in total.
More like this
All Dark & Cinematic →Noir Cinema
No. 028Letterboxed, grainy and lit from one side, like a 1947 crime picture.
Ember Forge
No. 045Coal black, molten orange and condensed capitals hammered out of the fire.
Moody Forest
No. 047Pine-dark greens, a sturdy old serif and mist hanging between the trunks.
Obsidian Champagne
No. 048Polished black stone, champagne gold hairlines and a whisper-thin roman.
Studio Black
No. 049Black page, white capitals the height of the screen, and nothing else.
Velvet Noir
No. 009A fashion monthly after midnight: lacquer black, oxblood ink, flash-lit photography.