Sovereign Atelier

The interface operates on an ultra-calm warm cream canvas (#FBF9F5) that swaps standard SaaS clinical coldness for refined tactile warmth. Deep hierarchy is established using contrasting background blocks: a creamy sandstone panel (#EFEAE3) for the primary greeting and a dusty sage-olive monolith (#848E7C) for progress milestones. Typography is anchored by a high-contrast literary serif (Canela match) paired with an unobtrusive geometric sans (Plus Jakarta Sans match) at 14px for utility controls. Large outer containment surfaces employ generous 28px corner radii, while primary imagery is shaped into classical architectural arches (160px top radius). Interactive emphasis relies on a single vibrant cobalt blue fill (#2B66D6) for the primary creation CTA, preventing the warm earthy palette from feeling passive. Observed paddings follow an airy cadence of 32px inside major cards, with 20px gaps between layout regions.

1 design references

Prompt metadata
Shared by	@Devault
Model	GPT Image 2.5
Category	Web design
Dataset	stretchcloud · awesome-gpt-image-prompt-2.5

The prompt

Design a light-mode web interface screen: editorial elegance meets creator utility through architectural arches, soothing earthen canvases, and modern bookish typography.

LAYOUT
The workspace uses a persistent 240px utility sidebar pinned to the left, adjacent to a wide responsive canvas. The primary canvas begins with a minimal utility header (search and profile avatar), cascading immediately into a large split-hero banner with arched photography. Directly beneath sits an earthy sage-tinted milestone card, followed by section headings and a three-column resource card grid. Rhythm is governed by large 28px rounded compound blocks spaced 24px apart.

PALETTE (use these exact hex values)
- #FBF9F5 — Warm Linen Canvas: Global application viewport background and low-contrast sidebar base
- #EFEAE3 — Oatmeal Surface: Top welcome hero card container surface providing soft warm separation
- #848E7C — Muted Sage: Milestone achievement block background housing marketing progress metrics
- #2B66D6 — Studio Cobalt: High-priority action buttons such as Create New CTA
- #B88746 — Raw Umber: Micro eyebrow labels and decorative divider rules above serif headlines
- #1C1B18 — Deep Licorice: Headlines, high-priority labels, and active navigation text states
- #6B665F — Earth Smudge: Secondary descriptors, inactive sidebar icons, and file metadata captions
- #FFFFFF — Pure White: Elevated modal badges, circular gauge base, and secondary cards

TYPOGRAPHY
Typeface Canela (or Playfair Display, Ogg, Instrument Serif), weights 400/500. Sizes 11px caption, 13px body-sm, 15px body, 17px body-lg, 22px subheading, 32px heading, 46px display. Tracking -0.02em at display sizes. The typographic tone is bookish, bespoke, and authoritative, reading like an art monograph or luxury studio publication rather than standard SaaS. The transitional serif conveys pedigree and thoughtful curation, while the clean geometric sans provides crisp, legible operational utility. Playfair Display or Canela is vital for headlines; swapping in default system sans-serifs completely eliminates the signature editorial persona.

GEOMETRY & SPACING
Corner radii — cards 28px, links 6px, inputs 10px, buttons 10px. Spacing on a 8px unit, 20px gaps, 40px between sections, 1360px container, airy density.

DEPTH
Depth is created through organic planar overlapping rather than heavy directional drop shadows. Floating elements like the circular progress badge and resource preview card cast faint, diffused ambient blurs (0 12px 32px rgba(33, 30, 25, 0.06)) while resting partly across panel seams. Layer hierarchy relies predominantly on distinct surface fills rather than simulated physical light.

IMAGERY
Imagery features warm, desaturated natural light photography evoking lifestyle editorial magazines, ceramics, dry botanical stems, and relaxed natural portraiture. Subjects utilize earthy linen, clay, and timber palettes with warm highlights. Bright corporate vector illustrations, 3D renderings, and high-contrast neon photography are strictly prohibited.

SIGNATURE DETAIL — the thing that makes this design itself
The signature element is the combination of an architectural semicircular arch image mask integrated directly inside a soft, low-contrast oat card (#EFEAE3), juxtaposed against an italicized display serif headline. This move firmly anchors the digital dashboard in physical interior and print publication aesthetics. It fails if the arch aspect ratio becomes squashed or if placed against high-contrast, saturated backgrounds.

MUST
- Pair architectural Roman arch masks with wide, soft-tinted surrounding cards.
- Use rich italic display serif cuts on sentence fragments to inject editorial luxury.
- Retain generous interior padding (32px to 48px) within content container blocks.
- Reserve solid cobalt blue solely for high-conversion primary action triggers.

AVOID
- Never use cold slate blues or sterile #000000 black in text or borders.
- Do not set full body copy paragraphs in serif type; reserve it for titles.
- Avoid sharp 0px corners; all card surfaces must maintain at least 14px to 28px radii.
- Do not drop harsh black drop shadows; rely on soft atmospheric tint overlays.

OUTPUT
Render as a clean, pixel-crisp UI design at roughly 1536:3840. Flat vector rendering, real legible text, no browser chrome, no device mockup frame, no watermark, no lorem ipsum placeholder blocks.

Try in DraPub

More prompts from the same visual neighborhood.

Back to prompt gallery

Web designDesign reference

Abyssal Ledger

The canvas is submerged in a rich midnight petrol slate (#0b121b), eschewing pure black in favor of deep oceanic navy undertones. Surfaces sit on elevated dark containers (#111c26) demarcated by razor-thin slate borders (#1c2a38) rather than heavy drop shadows. High-luminance electric cyan (#1de9b6) acts as the primary brand beacon and indicator of positive momentum, harmonized with electric violet (#a855f7) and amber gold (#f59e0b) for categorical multi-series data. Numerical metrics dominate the visual hierarchy through high-contrast bold white numerals (24px to 28px) paired with quiet slate captions (#64748b). Cards feature generous 16px corner radii and 20px internal padding, balancing information density with breathing room. A viewer immediately registers the four top-tier summary cards with seamless, borderless bottom sparklines before moving into the split data-visualization grid.

Web designDesign reference

Acoustic Minimal

This layout pairs a permanent dark charcoal sidebar (#121316) with an airy, pale grey-beige canvas (#F5F5F7) housing rounded structural cards (#FFFFFF). The aesthetic borrows heavily from high-end Danish and Japanese acoustic industrial design, contrasting stark architectural typography against tactile metallic renders in bronze and milled aluminium. Vibrant electric blue (#1E6BFF) serves strictly as a high-contrast functional accent for interactive triggers like primary CTA pills and cart badges, while amber (#E5A93C) indicates availability statuses. Typography is set in a neutral neo-grotesque with sharp tracking shifts between wide uppercase micro-labels and compressed display headlines (e.g., 'NB—32' at ~52px). Generous 24px internal card padding and large 20px card corner radii create soft modular islands. The primary visual tension arises from the interplay between monolithic pitch-black elements and luminous warm whites.

Web designDesign reference

Aegis Clinical

The interface operates on an ultra-clean white (#ffffff) and pale ice-blue surface hierarchy, using high-contrast slate (#0f172a) typography to project institutional authority and medical safety. Brand royal blue (#1668e3) functions strictly as a primary interaction and focal anchor, highlighting critical conversion paths and anchoring the dual-tone display headline. Secondary service departments are differentiated through soft pastel icon discs (spanning 48px to 56px in diameter) in tinted crimson, mint, lavender, and sky blue. Structural cards employ soft 16px corner rounding paired with faint, diffused ambient shadows (0 10px 30px rgba(15,23,42,0.04)). The prominent architectural hero imagery dissolves into the white canvas via a gentle gradient mask, visually uniting the physical facility with the digital portal.

Web designDesign reference

Aegis Cyber Luxe

The interface marries an ultra-dense, dark command rail (#070e1c) with a radiant, airy light canvas (#f8fafd) that houses executive-level threat intelligence. Hierarchy relies on high-contrast text sizing and surgical neon accents: vivid royal blue (#165dfc) for primary actions and safe-state telemetry, juxtaposed against alert crimson (#f04438) for imminent malware breaches. Typography is rendered in an ultra-clean geometric sans with tight headline tracking (-0.02em) and muted slate body copy (#64748b). Surface containers exhibit subtle 1px borders (#e8edf5) with a uniform 16px corner radius, floating gently above pale atmospheric radial gradients. The eye is immediately captured by the hero 3D composition, featuring a hyper-detailed dark monitor flanked by translucent glassmorphic telemetry cards and glowing threat icons.