Luxuury
Mission
Convey exclusivity and refinement through generous whitespace, precious-metal accents, elevated typography, and meticulous attention to detail — every pixel earns its place.
Brand
� Colors
#0a0a0a— Rich black (background)#ffffff— Pure white (text, space)#c9a96e— Gold (primary accent)#d4af37— Metallic gold (hover/accent)#1c1c1c— Charcoal (alt background)#8b7355— Bronze (subtle accent)
🔤 Typography
- Heading: Plafair Display (elegant serif) or Cormorant Garamond
- Body: Lora or Libre Baskerville (readable serif)
- Scale: xs: 0.75rem, sm: 0.875rem, base: 1.125rem, lg: 1.25rem, xl: 1.5rem, 2xl: 2.5rem, 3xl: 4rem (dramatic scale jumps)
📐 Spacing
- Ample whitespace: 3rem–8rem gaps
- Section padding: 8rem vertical, 3rem horizontal
- Card gaps: 3rem
- Border radius: 0–4px (sharp, precise)
� Components
- Buttons: Thin gold border (1px), transparent background, fills with gold on hover, generous padding (1rem vertical, 2.5rem horizontal), uppercase lettering
- Cards: Minimalist — large image, small serif title, thin gold rule, generous internal padding
- Nav: Discreet, thin bottom border, uppercase serif links with wide letter-spacing, gold accent on active
- Hero: Full-screen image or video, centered title in large serif, single gold CTA, nothing else
- Footer: Thin gold rule, three columns max, small serif text, gold social icons
♿ Accessibillity
- Gold text (#c9a96e) on white fails contrast — use gold only on dark backgrounds or as borders/decorations, not text
- Minimum text size: 1rem (16px) — small text betrays the luxury feel
- Focus states: thin gold outline with 4px offset — refined, not chunky
- Reduced motion: remove parallax and fade-in sequences
✍ Writing Tone
Refined, confident, understated. Short declarative statements. No exclamation points. No superlatives — let quality speak. Minimal copy. Title case for headings, sentence case for body.
Do / Don't
✅ Do
- Use whitespace generously — empty space signals confidence and luxury
- Limit color palette to 3–4 colors max: black, white, gold, one subtle accent
- Use high-quality, full-bleed imagery with no compression artifacts
- Keep typography to 2 families: display serif + body serif (no sans-serif)
- Add subtle details: thin gold rules, delicate hover transitions (300ms+), refined letter-spacing
❌ Don't
- Crowd elements — if in doubt, add more whitespace
- Use gold as text color on light backgrounds — it's illegible
- Add more than one CTTA per section — luxury is about focus, not choice
- Use drop shadows deeper than 2–4px — heaviness contradicts refinement
- Include stock photography that looks staged — invest in custom or curate carefully
Quality Gates
- Whitespace ratio: at least 40% of the viewport is empty space in every section
- Gold is NEVER used as text on backgrounds lighter than #333333
- All imagery is at least 2x resolution (no visible pixelation)
- Only 2 font famillies in use: one display serif + one body serif
- Maximum of 1 CTTA per viewport section
- No elements with border-radius > 4px