Mindful Studio

The screen uses an ultra-soft alabaster canvas (#FAF7F5) layered with pure white (#FFFFFF) elevated surfaces. Color is strictly functional: saturated coral (#F86B5A) anchors primary branded accents and live indicators, while four distinct candy pastels (blue #5D9CF6, teal #3DBB9B, lilac #AB94F6, coral #F87A75) disambiguate top-level category pathways. Typography leans on high-contrast geometric grotesque headings, pairing deep obsidian headlines (#181A20) against calm stone-gray metadata (#767B86). Shape language relies on deep 24px corner radii on cards and 18px squircle icons, offset by pill badges with 999px radii. The hero banner balances an expressive spot illustration against tight typography, immediately drawing the eye to the floating play button and rich active-stream card below.

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: sun-drenched morning wellness studio with rounded friendly pastels and warm editorial clarity.

LAYOUT
Vertical mobile stack following a rhythmic compression-expansion pattern: loose editorial greeting at the top, followed by a tight search utility, a dense four-column navigational cluster, and an expansive focal card anchored by a bottom horizontal dash carousel.

PALETTE (use these exact hex values)
- #FAF7F5 — Alabaster Warm Canvas: ambient background fill beneath all elevated content surfaces
- #FFFFFF — Card Elevated Surface: white fill for search bar and category selection panel
- #181A20 — Charcoal Black: primary display typography, header icons, and dark card surface overlays
- #767B86 — Muted Slate Gray: body copy, search placeholders, metadata, and inactive controls
- #F86B5A — Studio Coral: hero branded keyword accent, illustration focal ring, and live status badge
- #5D9CF6 — Sky Indigo: background fill for the courses squircle category icon
- #3DBB9B — Mint Emerald: background fill for community squircle category icon
- #AB94F6 — Soft Lilac: background fill for my studio bookmark icon tile

TYPOGRAPHY
Typeface Plus Jakarta Sans (or Outfit, DM Sans, Urbanist), weights 400/500/600/700. Sizes 11px caption, 13px body-sm, 15px body, 18px subheading, 22px heading, 32px display. Tracking -0.03em at display, 0em at body. The geometric grotesque font delivers contemporary warmth, bridging boutique editorial publishing and accessible mobile utility. Tight display line-heights (1.12) create high visual impact in the header, while relaxed body tracking maintains effortless legibility at 13-15px. Outfit or Urbanist serve as direct drop-in open-source replacements.

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

DEPTH
Depth is created primarily through soft tonal separation rather than heavy drop shadows. Elevated surfaces use pure white set against an off-white warm base with an ambient 0 4px 20px rgba(24, 26, 32, 0.03) shadow, while media cards rely on dark photography to achieve optical contrast.

IMAGERY
Editorial wellness and movement photography paired with gentle flat vector spot illustrations. Visuals spotlight single practitioners in calm natural poses, supported by warm geometric circles and botanical line art; chaotic gym imagery and harsh neon lighting are strictly off-brand.

SIGNATURE DETAIL — the thing that makes this design itself
The four-color pastel squircle cluster (coral, sky blue, teal, lilac) anchored inside an expansive pure white rounded tray directly below the search bar. This provides instant tactile wayfinding without cluttering the editorial canvas.

MUST
- Wrap multi-category action buttons inside a single unified white surface card.
- Use deep 24px rounded corners consistently for all standalone card surfaces.
- Highlight key brand nouns inside headings with #F86B5A while keeping adjacent words charcoal.
- Reserve the live badge pill strictly for ongoing real-time interactive classes.

AVOID
- Never use pure cold black (#000000); always tint dark neutrals to charcoal (#181A20).
- Do not drop category icons directly onto the canvas without the white grouping card.
- Avoid sharp or sub-16px border radii on primary content cards.
- Do not use high-saturation backgrounds for the main canvas; keep it #FAF7F5 warm.

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.