Curated Archive

The interface operates on an ultra-pale porcelain canvas (#FBFBFC) with floating crisp white (#FFFFFF) cards bound by subtle 20px corner radii and hairline 1px borders (#EEEEF0). Deep evergreen (#173A2F) is used sparingly as the singular grounding brand colour for featured active states, primary CTA buttons, and selected size badges. Typography exhibits a clear dual hierarchy: an editorial display serif for the prominent header and product titles paired with an understated neutral grotesk sans for micro-labels and system copy. Spacing adheres to an airy rhythm with 16px page margins and generous 16px inner card padding separating product photography from metadata. A horizontal stories-style brand carousel anchors the top navigation above dense horizontal dual-column product cards. A first-time observer immediately registers the deliberate juxtaposition of gallery-grade archival photography against an ultra-refined luxury editorial layout.

1 design references

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

The prompt

Design a light-mode mobile app interface screen: quiet luxury editorial commerce structured around deep pine green accents, high-contrast serif typography, and restrained tactile cards.

LAYOUT
The mobile view organizes vertically in a strict sequence: system status bar, branded editorial masthead with utility search, horizontal circular brand filter rail, and a vertical stack of composite product cards. Inside each card, the layout bifurcates into an image frame on the left and metadata plus actions on the right. Action buttons are placed predictably at the bottom right corner of each card unit.

PALETTE (use these exact hex values)
- #FBFBFC — Porcelain Canvas: Global application background setting a pristine, gallery-like ambience
- #FFFFFF — Pure White: Card containers, search button surface, and active swatch rings
- #F3F3F5 — Studio Neutral: Consistent studio backdrop fill behind cutout product imagery
- #173A2F — Deep Pine: Primary Add to Bag CTA, featured category circle, and active size indicator
- #E7EFEA — Sage Mist: Background for confirmation states such as the Added to bag pill
- #111614 — Obsidian Ink: Primary page header, product titles, prices, and high-emphasis icons
- #767B79 — Mineral Slate: Header subtitle, inactive brand labels, and unselected size labels
- #EEEEF0 — Hairline Rule: Delicate borders framing cards, circular icon actions, and dropdown toggles

TYPOGRAPHY
Typeface Canela (or Playfair Display, Instrument Serif, Caslon Book), weights 400/500. Sizes 11px caption, 12px body-sm, 14px body, 15px subheading, 18px heading, 44px display. Tracking -0.02em at display, -0.01em at titles. The typographic tone is aloof, cultured, and authoritative, evoking international fashion biannuals like 032c or Fantastic Man. High stroke contrast in the Canela-like serif delivers instant cultural prestige, while neutral grotesque sans elements provide utilitarian legibility for sizes and pricing. When licensed, Canela and SF Pro should be prioritized; Instrument Serif and Inter serve as robust open-source substitutes.

GEOMETRY & SPACING
Corner radii — cards 20px, links 999px, inputs 10px, buttons 10px. Spacing on a 4px unit, 16px gaps, 24px between sections, 390px container, comfortable density.

DEPTH
Depth is strictly physical and minimal, rejecting layered floating elevations. Product cards exist on a single 1px hairline-bordered plane over the porcelain base, bolstered by an imperceptible 0 4px 12px rgba(0,0,0,0.02) shadow. Controls like buttons and chips rest flat without skeuomorphic gradients or heavy bevels.

IMAGERY
Imagery strictly follows luxury atelier cataloguing: pristine studio packshots on light neutral grey fills with natural, soft floor contact shadows. Subject matter includes avant-garde designer apparel, footwear, and accessories with zero background distraction. Busy street-style or lifestyle candid photos are forbidden within these card frames.

SIGNATURE DETAIL — the thing that makes this design itself
The signature element is the horizontal split product card pairing a 14px-radiused grey photographic mat on the left directly against an editorial typographic stack with an ultra-deep pine green (#173A2F) pill button on the right. It transforms a standard commerce listing into a tactile archive index card. Misusing it involves stacking the image vertically over the text or substituting the forest green with standard digital blue.

MUST
- Pair the editorial display serif exclusively with compact, uppercase neutral sans metadata.
- Reserve the #173A2F pine green strictly for focal interactions and the primary call-to-action.
- Isolate all product photography against neutral studio light-gray (#F3F3F5) bounding mats.
- Maintain uniform 20px card corner radius across the entire shopping feed.

AVOID
- Do not apply vivid saturated colours like red, pure blue, or bright green.
- Never replace the high-contrast display serif on product titles with a geometric sans.
- Avoid solid black backgrounds; this design relies on an open, gallery-grade white canvas.
- Do not crowd variant swatches; maintain at least 6px separation between touch targets.

OUTPUT
Render as a clean, pixel-crisp UI design at roughly 1280: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

Mobile interfacesDesign reference

Abyssal Depth

The screen is grounded in an ultra-dark navy canvas (#040a14) that blends directly into deep-sea hero imagery without harsh cutoffs. Vibrant cyan (#4de1fc) and saturated royal blue (#1b4bf5) provide directional illumination, serving both as high-intent callouts and luminous gradients across interactive elements. Typography is clean and geometric, relying on high-contrast white (#ffffff) for display statements and muted slate (#8fa2be) for logistical information. Spacing uses an 8px grid with generous vertical cadence, accented by cards and pills with generous corner radii (ranging from 16px to 24px). The immediate visual hook is the cinematic submarine emerging from caustic ocean beams, anchored by a vibrant gradient CTA button with a seamless directional arrow.

Mobile interfacesDesign reference

Abyssal Sentinel

The layout splits between a turbulent, full-bleed oceanic photo canvas at the top and an overlapping high-radius clinical white card sheet (#FFFFFF) rising from the lower viewport. Color establishes an immediate cognitive pivot: the brooding marine navy (#10232B) evokes volatile real-world chaos, while soft glacial mint (#BDE4E0) and deep abyssal teal (#0E2A32) communicate calculated technological control. Typography relies on a geometric neo-grotesk with strict hierarchical tracking: loose +1.5px tracking on 11px uppercase category tags, contrasting against tightly-tracked 30px display headings. Layout rhythms alternate between fluid circular pill shapes (radius 999px) and architectural rounded hexagons for photo masking. The eye is first arrested by the stark white display type across the ocean storm, immediately pulled downward by the glowing mint CTA pill into the clean corporate interface below.

Mobile interfacesDesign reference

Adaptive Motion

The interface is grounded on a warm off-white canvas (#F8F9FB) that allows crisp white rounded containers (#FFFFFF) to float with near-weightless elevation. Primary interaction hinges on a spirited coral red (#F05D5E), which drives the hero CTA, notification ping, ring chart, and selective typographic emphasis on 'moves.'. Typography relies on a modern geometric sans-serif, using weight modulation (Regular 400 to Extrabold 800) rather than scale alone to establish hierarchy. Layout modules are organized into distinct cards with generous 24px corner radii, giving the entire viewport an approachable, pebble-soft hand-feel. A user immediately notices the tactile juxtaposition between the rendered metallic fitness equipment angled against a pastel blush circle (#FAD5D5) and the bright coral progress arc at 72% below.

Mobile interfacesDesign reference

Aero Coastal

The canvas is structured around an ultra-clean white backdrop (#FFFFFF) framed by an expansive 36px-radius hero image tile depicting a sunlit alpine coast. Color is strictly bifurcated: visual drama belongs to natural photography and subtle pastel surface cards (#FFF1EE, #EDF5FF, #F3F0FF, #EEF9F6), while operational cues use vivid coral (#EE6C58) and sky blue (#3B82F6). Typography is anchored in crisp modern grotesque letterforms, employing stacked 38px display titles over landscape photos and 14px bold headers inside micro-cards. Component shapes maintain generous curvature, from 999px pills to 24px rounded service modules. A viewer immediately registers the high-contrast white typographic stack against the lake landscape before flowing downward into pastel feature tiles.