Build a Heritage Luxury site.

Build me a complete, responsive business website in the HERITAGE-LUXURY style — the dark editorial world of Cartier, Dior, Aman, and Bulgari: near-black grounds that frame photography like a velvet-lined case, oversized serif headlines set like inscriptions, vast quiet margins, and a single restrained metallic accent used only as punctuation. This style says "accumulated worth" through stillness and space, not through loudness. Combine this style seed with my brief below. If I don't give you the details, invent a plausible business that earns this weight — a private estate, a heritage jeweller, a grand hotel, an aged-spirit house, a bespoke tailor — and build a full, real demo for it, not a placeholder. This style is a FAMILY, not a single template — the same seed should produce visibly different sites for different businesses. A few dimensions are yours to choose: the exact DARK GROUND + METALLIC ACCENT, the SERIF pairing, and the overall LAYOUT COMPOSITION. Pick one of each that fits my brand and COMMIT to it across the whole site — every option below is equally on-style, so don't second-guess the choice with your own taste. ── INVARIANTS (never break these — they define the style) ── • Deep-field dark grounds. The page lives on near-black or a deep, desaturated dark (see options); photography and gold glow against it. Behind dense body text, lift the surface only slightly (e.g. #0D0D0D → #161616) so it stays quiet but readable — never a bright or pure-white background. • Oversized high-contrast serif headlines, set like inscriptions — large (often 80px+, up to a 160–200px single word as a whole-section statement), with wide letter-spacing (~+0.06–0.10em) and generous leading. Presence through scale and silence, never a shout. • ONE restrained metallic accent, rationed. A single warm metallic (champagne gold by default; bronze, aged brass, or another restrained metallic is fine) used ONLY as punctuation — a thin 1px rule under a heading, a hairline divider, a hover tint, a small mark. Never a bright saturated fill, never a filled button-blob, never two accent colors. • Vast margins and silence. Wide section padding, one thing at a time, lots of breathing room; a page that shows less feels more expensive than one that shows everything. • Editorial full-bleed photography, filling sections completely with no decorative border, warm dramatic single-source lighting (still-life / cinematic, not lifestyle snapshots). Overlay any headline in the dark lower third of the image, never over a face or focal point. • Motion is DRIFT — elements rise from opacity 0 with a small upward y-offset (~20px) over a slow 1.2–1.4s ease-out. Nothing snaps, bounces, scales, or slides fast. Honor prefers-reduced-motion, and keep ALL content visible without JavaScript. • CONTRAST (WCAG 2.2 AA, non-negotiable): every text/background pair is ≥4.5:1 for body, ≥3:1 for large/headline text. Use warm ivory (not pure white — pure white reads harsh) on the dark grounds; warm greige for muted text still ≥4.5:1. Over photography, guarantee the ratio with a solid darkening scrim under the text — never trust "it's probably dark enough there". ── VARIABLES (choose one of each that fits my brand, then commit) ── • DARK GROUND + METALLIC ACCENT — bring MY brand colors if I give them, pushed into this logic: a deep desaturated ground + warm ivory text + one restrained metallic. If I give none, choose (example grounds, not required: near-black #0D0D0D · deep navy #0A1628 · forest green #1B2B1E · charcoal #1A1A1A; example metallics: champagne #C9A96E · warm amber-gold #B8952A · bronze). A lighter heritage variant is also on-style if my brand calls for it — warm cream #F8F3EC ground with dark-ink #2C2318 text and a bronze accent — never a bright saturated background either way. • SERIF — one high-contrast display serif + a readable body face, via Google Fonts. Display, pick one: Cormorant Garamond · Playfair Display · EB Garamond · Cormorant. Body, pick one: the same serif at book size · Jost · a quiet humanist sans at 400/500. • LAYOUT COMPOSITION — choose one editorial feel and commit: centered editorial (headline centered, body in a ~50–60% column, breathing room both sides); a strict asymmetric split (large typography one side, full-height photography the other); a disciplined 2–3 column photo grid with a consistent gutter; or a full-bleed-hero-led flow with centered text passages between image sections. Also settle on your own hero composition, rule placement, and margin scale. ── MEDIA MODEL (photography-led) ── This style is strongly photography-led — plan primary imagery in the hero AND in at least two more sections, not just the hero. Use real placeholder <img> for every planned photo: crafted objects, architecture, materials, portraits in heritage settings, dramatic warm lighting, filling the section with no decorative frame. The only non-photographic ornament is type and the thin metallic rule — no icons, no illustrations, no SVG graphic decoration. Generate imagery appropriate to MY business, not a reuse of any demo. WHAT THIS SITE MUST ACHIEVE (business goal): Make it clear who this business is and the standard it holds, through atmosphere and proof rather than volume; establish authority and heritage; reassure a discerning visitor with real evidence (provenance, craft, credentials, named clients, results — whatever is true); and drive one clear, quiet next step — an enquiry, a private appointment, a reservation, a consultation. Let the business and its brief decide which sections serve that goal, include exactly those in a sensible order, and build each one fully. BUILD REQUIREMENTS — ship a complete, usable site, not a hero mock: • Real information architecture driven by MY business and goal — whatever sections build authority then trust then a quiet call to act, each with one clear job. Include understated navigation and a footer. • Don't be lazy with any section: each carries real content depth (never a title plus one thin line), proper internal hierarchy, and the full heritage treatment — including the required non-hero photography. If a section only serves the style, cut it; if a section serves the goal but feels thin, flesh it out. • Real, tailored copy for MY business — spare, assured, unhurried, written to convey standing and reassure, never filler and never loud. Never lorem. • Fully responsive and accessible: semantic landmarks, alt text, and the CONTRAST invariant enforced on EVERY section — especially ivory text over photography (use a scrim). On mobile, keep the vast margins, oversized serif, and slow drift; let images go full-bleed. • Apply the chosen ground, accent, serif, and layout to EVERY section, not just the hero.

Best for AI website builders — Lovable, v0, Bolt

Restyle my existing site into the HERITAGE-LUXURY look — the dark editorial world of Cartier, Dior, Aman, and Bulgari: near-black grounds that frame photography like a velvet-lined case, oversized serif headlines set like inscriptions, vast quiet margins, and a single restrained metallic accent used only as punctuation. Keep ALL of my current content, copy, pages, and structure exactly as they are; change only the visual language so the page carries accumulated weight through stillness and space. Do not invent new pages, remove sections, or rewrite my words. Keep MY brand hues — carry my existing brand colors into the scheme rather than swapping in new ones. Push them into this logic: a deep desaturated ground + warm ivory text + ONE restrained metallic accent (my brand's own metallic if it has one, else champagne gold), used only as punctuation. Then make one SERIF choice and COMMIT — a high-contrast display serif + a readable body face that suit my brand. ── INVARIANTS (never break these) ── • Move the page onto a deep-field dark ground (near-black or a deep desaturated dark). Behind dense body text, lift the surface only slightly so it stays quiet but readable — never a bright or pure-white background. • Reset headlines to an oversized high-contrast serif set like an inscription — large, wide letter-spacing (~+0.06–0.10em), generous leading. Presence through scale and silence, not a shout. • Ration the accent to ONE restrained metallic used only as punctuation — a thin 1px rule under a heading, a hairline divider, a hover tint. Strip bright saturated fills and filled button-blobs; a heritage button is a hairline-bordered or text-and-rule affair, never a candy fill. Never two accent colors. • Open the layout up — widen margins and section padding, let it breathe, one thing at a time. Remove clutter and dense stacking in favor of silence. • Wherever my content has imagery, present it editorial and full-bleed with no decorative frame, warm dramatic lighting, the subject unobscured; overlay any text in the dark lower third with a scrim. • Motion becomes DRIFT — elements rise from opacity 0 with a small upward y-offset (~20px) over a slow 1.2–1.4s ease-out. Remove every snap, bounce, fast slide, and scale. Honor prefers-reduced-motion and never leave a section stuck invisible; keep content visible without JavaScript. • Never: bright or saturated button/panel fills, more than one accent color, rounded corners, box shadows, icons or illustrations as ornament, pure-white backgrounds, fast or bouncy motion. ── SERIF (pick one pairing to suit my brand, then commit) ── One high-contrast display serif (Cormorant Garamond · Playfair Display · EB Garamond · Cormorant) + one readable body (the same serif at book size · Jost · a quiet humanist sans at 400/500), loaded via Google Fonts. Present any existing image full-bleed with no decorative border; replace decorative icons and gradient blobs with type, silence, and the single thin metallic rule. Keep it responsive and accessible — enforce WCAG 2.2 AA contrast on every section (≥4.5:1 body, ≥3:1 large; warm ivory on the dark grounds, warm greige for muted still ≥4.5:1; a scrim under any text over photography). Restyle what already exists so every section carries the heritage system consistently — same content, new atmosphere.

Paste alongside your existing site/code for an AI coding agent to apply

Design a single section in the HERITAGE-LUXURY style — the dark editorial world of Cartier, Dior, Aman, and Bulgari: a near-black ground that frames photography like a velvet-lined case, an oversized serif headline set like an inscription, vast quiet margins, and a single restrained metallic accent used only as punctuation. A low-commitment preview of the style, built richly for whatever section I ask for. Tell me in your own words, alongside this prompt, which section you want and the job it has to do — a full-bleed hero, a heritage/provenance statement, a craft or collection showcase, a private-appointment call-to-action, an inscription section (one oversized word). If I don't name one, build a full-bleed hero for a plausible heritage business you invent that earns this weight. Whatever the section, build it fully and richly — don't be lazy: real, tailored copy, proper hierarchy, and depth, not a title plus one thin line. ── INVARIANTS ── • A deep-field dark ground (near-black or deep desaturated dark). An oversized high-contrast serif headline set like an inscription — large, wide letter-spacing (~+0.06–0.10em), generous leading. ONE restrained metallic accent used only as punctuation (a thin 1px rule, a hairline divider, a hover tint) — never a bright saturated fill, never two accents. Vast margins and silence. Motion is DRIFT — a slow rise from opacity 0 with a ~20px upward y-offset over 1.2–1.4s ease-out; content visible without JavaScript, honoring prefers-reduced-motion. • Never: bright/saturated fills, more than one accent color, rounded corners, box shadows, icons or illustrations as ornament, pure-white backgrounds, fast or bouncy motion. ── VARIABLES (pick one of each, commit) ── • DARK GROUND + METALLIC ACCENT — bring my brand colors if I give them (a deep desaturated ground + warm ivory text + one restrained metallic); otherwise choose (example grounds: near-black #0D0D0D · deep navy #0A1628 · forest green #1B2B1E; example metallics: champagne #C9A96E · warm amber-gold #B8952A · bronze). A warm-cream light variant (#F8F3EC ground, #2C2318 ink, bronze accent) is also on-style — never a bright saturated background either way. • SERIF — one high-contrast display serif (Cormorant Garamond / Playfair Display / EB Garamond / Cormorant) + one readable body face (the same serif at book size / Jost / a quiet humanist sans), via Google Fonts. If the section genuinely needs an image, use a real placeholder <img> presented editorial and full-bleed with no decorative frame, warm dramatic lighting, subject unobscured — never a fake colored div standing in for a photo. Overlay any headline in the dark lower third with a solid scrim. Include a quiet, understated call to act (a hairline-bordered or text-and-rule link, never a candy fill) where the section's job calls for one. Make it responsive and accessible — WCAG 2.2 AA contrast (≥4.5:1 body, ≥3:1 large): warm ivory on dark grounds, never pure white, never light-on-light, and a scrim under any text over photography. Write real, tailored copy for the subject, not lorem.

Good for a focused first pass, or a chat-based assistant like ChatGPT/Claude