High Contrast Luxury
Generates premium, dark-background UI with dramatic spacing, gold or cream accents, thin serif typography, and the kind of restrained elegance you'd find in a high-end hotel lobby website.
Added February 7, 2026 by unslop.dev
Example output
Hero section
Established 2019
The Art of
Quiet Design
We craft digital experiences for brands that understand the power of restraint. Less noise, more resonance.
View code
<div style="background: #09090b; padding: 6rem 2rem; display: flex; flex-direction: column; align-items: center; text-align: center;"> <p style="font-size: 0.6875rem; font-weight: 400; text-transform: uppercase; letter-spacing: 0.2em; color: #d4a574; margin: 0 0 2rem 0;">Established 2019</p> <h1 style="font-family: Georgia, 'Times New Roman', serif; font-size: 3.25rem; font-weight: 300; color: #faf7f2; letter-spacing: 0.08em; text-transform: uppercase; margin: 0; line-height: 1.2;">The Art of<br>Quiet Design</h1> <div style="width: 3rem; height: 1px; background: #d4a574; margin: 2.5rem 0;"></div> <p style="font-size: 0.875rem; color: #a8a29e; max-width: 28rem; line-height: 1.8; margin: 0 0 3rem 0; font-weight: 300;">We craft digital experiences for brands that understand the power of restraint. Less noise, more resonance.</p> <button style="background: transparent; border: 1px solid #d4a574; color: #d4a574; padding: 1rem 2.5rem; font-size: 0.6875rem; font-weight: 400; text-transform: uppercase; letter-spacing: 0.15em; cursor: pointer;">Explore Our Work</button> </div>
Feature card
01 — Strategy
Brand Positioning & Identity
We define the strategic foundation that every visual decision is built upon. Market analysis, competitive landscape, audience insight โ distilled into a clear, ownable position.
View code
<div style="background: #09090b; padding: 4rem 2rem; display: flex; justify-content: center;">
<div style="background: #111111; border: 1px solid rgba(255, 255, 255, 0.06); max-width: 26rem; padding: 2.5rem;">
<p style="font-size: 0.6875rem; font-weight: 400; text-transform: uppercase; letter-spacing: 0.2em; color: #d4a574; margin: 0 0 1.75rem 0;">01 — Strategy</p>
<h3 style="font-family: Georgia, 'Times New Roman', serif; font-size: 1.375rem; font-weight: 300; color: #faf7f2; letter-spacing: 0.06em; margin: 0 0 1rem 0; line-height: 1.4;">Brand Positioning & Identity</h3>
<p style="font-size: 0.8125rem; color: #a8a29e; line-height: 1.8; margin: 0 0 2rem 0; font-weight: 300;">We define the strategic foundation that every visual decision is built upon. Market analysis, competitive landscape, audience insight โ distilled into a clear, ownable position.</p>
<div style="border-top: 1px solid rgba(255, 255, 255, 0.06); padding-top: 1.75rem; display: flex; justify-content: space-between; align-items: center;">
<span style="font-size: 0.6875rem; text-transform: uppercase; letter-spacing: 0.12em; color: #a8a29e; font-weight: 400;">8–12 week engagement</span>
<span style="font-size: 0.6875rem; text-transform: uppercase; letter-spacing: 0.12em; color: #d4a574; cursor: pointer; font-weight: 400;">Learn More →</span>
</div>
</div>
</div>CTA section with dramatic spacing
Begin a Conversation
Ready to elevate
your presence?
We take on a limited number of projects each year to ensure every client receives our undivided attention.
View code
<div style="background: #09090b; padding: 8rem 2rem; text-align: center;">
<div style="max-width: 36rem; margin: 0 auto;">
<div style="width: 3rem; height: 1px; background: rgba(212, 165, 116, 0.4); margin: 0 auto 3rem auto;"></div>
<p style="font-size: 0.6875rem; font-weight: 400; text-transform: uppercase; letter-spacing: 0.2em; color: #a8a29e; margin: 0 0 2.5rem 0;">Begin a Conversation</p>
<h2 style="font-family: Georgia, 'Times New Roman', serif; font-size: 2.5rem; font-weight: 300; color: #faf7f2; letter-spacing: 0.06em; margin: 0 0 1.5rem 0; line-height: 1.3;">Ready to elevate<br>your presence?</h2>
<p style="font-size: 0.875rem; color: #a8a29e; line-height: 1.8; margin: 0 0 3.5rem 0; font-weight: 300;">We take on a limited number of projects each year to ensure every client receives our undivided attention.</p>
<div style="display: flex; gap: 1.5rem; justify-content: center; align-items: center;">
<button style="background: transparent; border: 1px solid #d4a574; color: #d4a574; padding: 1rem 2.5rem; font-size: 0.6875rem; font-weight: 400; text-transform: uppercase; letter-spacing: 0.15em; cursor: pointer;">Schedule a Call</button>
<span style="font-size: 0.6875rem; text-transform: uppercase; letter-spacing: 0.12em; color: #a8a29e; font-weight: 400; cursor: pointer;">View Case Studies →</span>
</div>
<div style="width: 3rem; height: 1px; background: rgba(212, 165, 116, 0.4); margin: 3rem auto 0 auto;"></div>
</div>
</div>System prompt
You generate UI in a high-contrast luxury style โ dark, restrained, and dripping with quiet confidence. Think five-star hotel website, prestige fashion brand, private members' club. Every element has room to breathe. Gold accents whisper, never shout. The design says "we don't need to try hard" by trying very, very hard at subtlety. VISUAL RULES: - Background: Near-black. #09090b or #0a0a0a. Not gray โ almost pure black with a hint of warmth. - Text headings: Cream/warm white (#faf7f2). Thin weight (font-light, 300). Large tracking (letter-spacing: 0.1em). Often uppercase. Serif font if available (Georgia, 'Playfair Display', 'Times New Roman'). - Text body: Muted stone (#a8a29e). Small size (14px or smaller). Light weight. Leading-relaxed. - Accent: Gold/champagne (#d4a574 or #c9a87c). Used on borders (sparingly), buttons, small labels, divider lines. Never as a background fill on large areas. - Borders: 1px solid rgba(255, 255, 255, 0.08) โ barely visible dividers. Sometimes gold at low opacity: 1px solid rgba(212, 165, 116, 0.3). - Spacing: Enormous. padding: 6rem 0 between sections. padding: 2.5rem inside cards. Gap between elements is generous. Let the dark background do the work. - Border radius: 0 or very small (2px). Sharp edges convey precision and formality. No rounded-xl, no pill shapes. - Shadows: None, or extremely subtle. The dark background IS the shadow. - Layout: Centered, narrow max-width (max-width: 48rem). Lots of vertical space. Elements feel isolated and intentional. SPECIFIC PATTERNS: - Hero text: Massive heading (48-72px) in cream, font-light, letter-spacing: 0.1em, uppercase. Subtext in #a8a29e, small, generous margin-top. - Cards: Background #111111 or #0f0f0f. Border: 1px solid rgba(255,255,255,0.06). No border-radius or 2px max. Padding: 2.5rem. Generous internal spacing. - Buttons primary: Background transparent, border: 1px solid #d4a574, color: #d4a574, padding: 1rem 2.5rem, letter-spacing: 0.15em, text-transform: uppercase, font-size: 0.6875rem. - Buttons secondary: No border, color: #a8a29e, text-transform: uppercase, letter-spacing: 0.12em, font-size: 0.6875rem. Underline on hover. - Dividers: 1px solid rgba(255,255,255,0.06). Or a short gold line (width: 3rem, height: 1px, background: #d4a574) used as a decorative separator. - Labels: Uppercase, letter-spacing: 0.15em, font-size: 0.6875rem, color: #d4a574 or #a8a29e. ANTI-PATTERNS: - No bright colors. No blue, no green, no red. Only cream, gold, and neutrals. - No thick borders. Nothing above 1px. - No rounded corners beyond 2px. This is not friendly; it's formal. - No dense layouts. If content feels packed, add more space. - No casual or playful tone. Copy should be minimal, refined, almost cold. - No heavy font weights on headings. font-light or font-normal only. Bold is for body emphasis, not display. - No solid background colors on buttons. Outlines and transparency only.
Related prompts
The Grand
Opening Gala
Join us for an evening of extraordinary design, live music, and curated experiences at the Metropolitan.
Crafted With
Precision & Purpose
Every detail considered. Every element intentional. We create experiences that endure beyond the moment.
Art Deco
Generates UI inspired by 1920s Art Deco โ geometric patterns, gold on dark backgrounds, symmetrical layouts, Didot-style serifs, and the luxurious geometry of the Chrysler Building lobby.
Art Nouveau
Generates UI inspired by the Art Nouveau movement โ sinuous organic curves, botanical motifs, whiplash lines, Mucha-style decorative borders, and the belief that art should permeate every designed surface.
โฆ Proclamation
The Architecture of Enduring Interfaces
Great design, like great architecture, outlasts the fashions that surrounded its creation. Build with stone, not with straw.
Gothic Revival
Generates UI with the drama of cathedral architecture โ deep purples and blacks, gold tracery details, pointed arch motifs, and the solemn grandeur of medieval illuminated manuscripts meets modern dark UI.