Ecommerce · Free
Véla
A luxury single-product store: near-white silence, one cinematic product pedestal, whisper-quiet motion, serif restraint.

Cormorant Garamond + InterLuxury minimal, cinematic product focus
prompt.txt — paste as your first message
You are designing the online home of a luxury object. Build a complete one-page store for a fictional fragrance called Véla No.1 ("Worn, not noticed."). Write every word — restrained, sensory, no exclamation marks, no lorem ipsum.
ART DIRECTION — gallery minimal. Background #FAFAF8, ink #1A1A18, bronze accent #8C7A5B for fine rules and the price. Vast whitespace; nothing competes with the product. The product itself is built in CSS: a tall frosted-glass bottle (layered gradients, a highlight streak, a thin bronze cap) standing on a soft shadow. Fonts via Google Fonts: "Cormorant Garamond" 500/600 for headlines (large, airy), "Inter" 300/400 for body in wide letter-spacing small caps for labels. Mood: museum vitrine.
LAYOUT, top to bottom:
1. Whisper nav — centered wordmark VÉLA, cart icon right, a 1px rule below.
2. Hero — the CSS bottle centered on a pale pedestal circle, product name in serif beneath, one sensory sentence, price in bronze, and a single black "Add to cart" button. A vertical "scroll" hint with a slowly drawing line.
3. Notes triptych — three columns (Top, Heart, Base) each with a serif note name, two-line description, and a small inline-SVG botanical line drawing.
4. Cinematic band — full-width near-black section: one serif sentence in cream fades in word by word as it enters the viewport.
5. Ritual — a horizontal three-step strip (Apply, Wait, Repeat) with thin numbered circles.
6. Provenance — split: left a short maker's letter in italic serif with a signature line; right three certifications in small caps with bronze rules.
7. Purchase block — bottle thumbnail, name, price, quantity stepper, add-to-cart; a quiet note on shipping beneath.
8. Footer — three small-cap links and a centered monogram.
MOTION: everything is slow and small. Hero bottle fades in over 900ms with a 6px rise; the highlight streak on the glass drifts once; word-by-word fade in the cinematic band (60ms per word, once); section reveals are 500ms opacity-only. Add-to-cart briefly sets the button text to "Added — thank you" with a 1px bronze pulse. Respect prefers-reduced-motion.
RULES: responsive at 375 / 768 / 1280 (triptych stacks, bottle scales). Semantic HTML, focus states, body contrast at least 7:1. All art is CSS and inline SVG — no images, no libraries. The page must be complete and beautiful with JavaScript disabled.Why these prompts work
Every template follows the same five-part structure, so the result is consistent every time:
01
Role + output contract
What to build and the quality bar — no lorem ipsum, real copy.
02
Art direction
Exact hex palette, Google-Fonts pairing, and mood keywords.
03
Layout spec
Section by section, top to bottom — nothing left to chance.
04
Motion spec
Entrances, scroll reveals, hovers, and timing curves.
05
Rules
Responsive breakpoints, accessibility, and what the AI must not do.
Works great for
Each industry page carries this style pre-tailored — your services, prices and palette already written in: