Heirloom Tales

The interface presents an empathetic, storybook onboarding canvas rendered in a delicate parchment tint (#FAF6F0) with soft background line art and a gentle bottom organic wave (#E9EFE7). Hierarchy is dictated not by loud badges, but by rich contrast: characters are encased in soft white rounded cards (radius 24px) paired with deep wine pill buttons (#5C1C29) that anchor each card. Typography alternates between an elegant, literary display serif for character names and primary titles, and a neutral, approachable sans-serif for secondary guidance. Ornamental wireframe motifs—such as delicate heart outlines, starbursts, and thin rule dividers with central diamond flourishes (#D8C6A5)—instill a whimsical, handcrafted aura. A reader's eye immediately locks onto the vibrant 3D stylized character busts centered over pastel pink silhouette blobs within the cards.

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: a tender storybook portrait gallery framed in warm parchment, organic waveforms, and deep wine velvet.

LAYOUT
The viewport follows a focused, symmetrical single-screen mobile layout. At the top, a subtle 9:41 status bar leads into a centered header motif, primary serif title ('Choose your sister'), and secondary instruction. The center stage is dedicated to a balanced 2-column side-by-side grid holding twin character cards. The bottom fifth transitions via a natural curved wave into a soft green tint holding a centered trust badge and two-line reassurance disclaimer.

PALETTE (use these exact hex values)
- #FAF6F0 — Parchment Ivory: Primary screen background canvas conveying warmth and paper-like tactility
- #FFFFFF — Card Surface White: Foreground card surface providing crisp contrast against the warm cream background
- #E9EFE7 — Sage Foam: Organic footer wave tone creating subtle grounded context for informational trust notes
- #5C1C29 — Deep Wine: Primary interactive button fill delivering high-contrast focal points inside character cards
- #FBE6E4 — Blush Aura: Soft organic halo behind 3D avatar portraits inside each card
- #D8C6A5 — Antique Filigree: Subtle wireframe line illustrations, card divider flourishes, and hairline embellishments
- #6C8469 — Muted Sage: Small trust icon fill in the lower verification badge
- #271B1F — Espresso Plum: Display headings, character names, and status bar elements
- #736365 — Warm Taupe: Descriptive body copy and auxiliary personalization text
- #FFFFFF — Button White: Action label text and navigation chevrons on wine buttons

TYPOGRAPHY
Typeface Cormorant Garamond (or Playfair Display, Libre Baskerville, EB Garamond), weights 400/500/600. Sizes 11px caption, 13px body-sm, 14px body, 22px heading, 28px display. Tracking -0.01em at display, 0 at title. The typographic pairing exudes storybook warmth, nostalgia, and refined craftsmanship. Cormorant Garamond lends a fairytale, heirloom quality with generous proportions and graceful serifs, making each character feel like an illustrated protagonist. Complementary sans-serif text (Plus Jakarta Sans) anchors the UI with clarity, preventing the experience from becoming overly ornate or illegible on small mobile screens.

GEOMETRY & SPACING
Corner radii — cards 24px, links 4px, inputs 12px, buttons 999px. Spacing on a 8px unit, 14px gaps, 32px between sections, 390px container, comfortable density.

DEPTH
Depth is handled through whisper-soft ambient diffusion rather than sharp stepped elevations. Cards float using a very pale warm shadow (0px 10px 28px rgba(90, 50, 60, 0.04)) over the parchment ground. Contrast is primarily compositional and chromatic—pure white card surfaces against beige canvas—creating effortless separation without heavy visual noise.

IMAGERY
Visuals rely on polished, 3D animated character busts exhibiting smooth claymorphic textures, warm skin tones, and expressive, closed-eye friendly smiles. Backing each character is a fluid, asymmetrical blush blob (#FBE6E4) flanked by delicate four-point star sparkles. The canvas background is decorated with faint, outline-only childlike doodles (chalkboard, horse, scissors) drawn in whisper-light gold line work.

SIGNATURE DETAIL — the thing that makes this design itself
The distinctive centerpiece is the twin storybook character card with its organic blush portrait halo, centralized filigree diamond divider, and deep wine pill CTA. This treatment transforms standard multi-choice radio options into an emotional, keepsake-like selection ritual. Misusing it by replacing the filigree with a generic flat grey border or replacing the pill with a square button instantly destroys the fairytale charm.

MUST
- Use warm off-white (#FAF6F0) rather than sterile #FFFFFF for the master canvas background.
- Pair elegant literary serifs for names and headings with a clean geometric sans for UI controls.
- Enclose 3D character avatars with soft organic blob silhouettes in pastel blush tones (#FBE6E4).
- Keep card corners generous with at least a 20px to 24px border radius for softness.

AVOID
- Do not use harsh black (#000000) for text; always employ espresso plum (#271B1F) or warm taupe.
- Avoid square or sharp button geometries; all action buttons must remain true rounded pills (999px).
- Never apply aggressive, dark shadows; cards should rely on subtle blur (rgba(60, 40, 45, 0.05)).
- Do not crowd the twin cards; maintain a comfortable 14px to 16px lateral gap between columns.

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