Art Deco brand page
Build a complete Art Deco brand webpage with dark gold geometry, fan ornaments and a symmetric composition.

Recipe typeUI design
Output formatSingle-page HTML/CSS
DeliverablesHero / showcase / story / contact
Version1.0
Build a complete Art Deco brand webpage with dark gold geometry, fan ornaments and a symmetric composition. A compact direction to help the next screen feel deliberate, specific, and easy to remix.
02 / Prompt
Create a complete Art Deco brand webpage from supplied brand material, delivering previewable HTML/CSS. Express a specific dark-gold geometric language, not vague “premium elegance”. Suitable for hospitality, boutique brands, jewelry or event introductions; no new business systems.
INPUT
Brand/audience: [name, industry, readers, confirmed positioning]
Content/assets: [real story, 2–4 products/services/spaces and descriptions, usable images]
Primary action: [inquire/view collection/explore space; real URL/email or none]
Brand constraints: [original logo, required colors, available fonts, language]
MISSING INFORMATION
Ask at most three blocking questions. Use clear image placeholders when needed. Do not invent achievements, prices, ratings, room availability or promises. If required brand colors conflict with dark gold, flag it and ask for priority; do not silently alter the logo or force every color into the design.
METHOD
1. Build navigation, hero with positioning, products/services/spaces, brand story, clear contact action, then footer. Use supplied content. Missing links mean labeled pending display entries, not fake booking, checkout or successful inquiry flows.
2. Establish three identifiers: central symmetric composition; #0D0D0D black or #0A1628 navy with #C9A84C gold and #F5F0E8 cream; fan, stepped-line or diamond ornament. At most one jewel accent, labeled a design proposal. Create original CSS/simple SVG geometry; do not copy source illustrations.
3. Use tall display proportions and measured tracking. Keep body copy readable. Chinese cannot simply inherit Latin all-caps rules or exaggerated tracking. Use solid body text; metallic gradients mainly decorate rather than being assumed legible text. Fine gold ornament lines do not replace visible interactive focus boundaries.
4. Symmetric two-column desktop sections become natural single-column mobile sections. Scale ornament to containers without covering copy. Keep formal rhythm without a long empty page. Semantic HTML/CSS, keyboard focus and non-color state cues. Optional mild motion is disableable and respects reduced motion. No framework installation, backend or tracker dependencies.
5. Check 390px/1440px, long brand names, missing imagery and actual text/background pairs. Record executed results; otherwise provide steps. No certification, functional booking or conversion improvement claims.
DELIVER
A. Page narrative/style explanation with assumptions and gaps.
B. One complete index.html code block with inline CSS, original geometry and replaceable asset paths.
C. Actual/pending destination table and verification records identifying display-only capabilities.
Preserve supplied facts and brand identity. The source is a style brief; this site adds full-page structure/code delivery. A specimen is not a real business service.
Site adaptation of Heiberg Industries / Designbrief, Art Deco (MIT): https://github.com/Heiberg-Industries/designbrief/blob/6b22ff3794eb2fe8d526ff32a3067022fa3ed6b6/styles/art-deco.md . Copyright (c) 2026 Heiberg Industries (https://heiberg.co). Full license: https://github.com/Heiberg-Industries/designbrief/blob/6b22ff3794eb2fe8d526ff32a3067022fa3ed6b6/LICENSE .03 / Negative prompt
vague luxury, missing geometry, ornaments covering copy, altered identity, unchecked gradient text, invented prices/ratings, fake booking, fabricated conversion/certificationRecipe typeArt Deco page design
Output formatSingle-page HTML/CSS
DeliverablesHero / showcase / story / contact
Version1.0