Artisanal Pantry

This mobile shopping experience operates on a warm parchment background (#FBF9F7) overlaid with pure white floating cards (#FFFFFF). Color hierarchy is strictly disciplined: a rich burgundy (#85273C) serves as the singular brand anchor, appearing on active pills, discount flags, and delicate heart outlines. Typography combines an elegant high-contrast editorial serif (similar to Canela or Playfair Display) for titles with a clean geometric sans (akin to Inter or SF Pro) for prices, weights, and metadata. Product cards feature generous 24px border radii, subtle non-diffuse shadows, and crisp top-corner badges (24px top-right flush alignment). Spacing is airy and deliberate, framing isolated grocery packshots with generous 16px internal padding and 16px column gutters.

1 张设计参考图

提示词信息
分享者	@Devault
模型	GPT Image 2.5
分类	移动端界面
数据集	stretchcloud · awesome-gpt-image-prompt-2.5

完整提示词

Design a light-mode mobile app interface screen: an editorial gourmet market balancing warm bone surfaces with deep wine accents and pristine studio photography.

LAYOUT
The mobile screen flows vertically: a 54px header with centered serif Discover title flanked by circular menu and search icon buttons; followed by a horizontally scrollable row of 48px pill category chips. Below sits a balanced 2-column grid separated by 16px gutters, each card presenting a generous 1:1.3 aspect ratio showcase.

PALETTE (use these exact hex values)
- #FBF9F7 — Bone Alabaster: Global application canvas background conveying an organic, high-end paper texture feel.
- #FFFFFF — Pure White: Background for product cards, navigation circle buttons, and inactive category pills.
- #85273C — Vintage Bordeaux: Selected category pill state, discount ribbon badges, and heart action stroke.
- #1D1D1F — Charcoal Black: Primary heading typography, product titles, and active numeric price labels.
- #76767A — Muted Slate: Subtitle under Discover header and strikethrough original pricing.
- #EBE8E4 — Neutral Border: Outlines around inactive category pills and circular top bar utility buttons.
- #F5F3F0 — Soft Tint: Fill color for secondary square add-to-cart stepper buttons on cards.

TYPOGRAPHY
Typeface Canela (or Playfair Display, Roslindale, Freight Text), weights 400/500/600. Sizes 11px caption, 13px body-sm, 14px body, 15px subheading, 16px heading, 18px heading-lg, 26px display. Tracking -0.015em. The voice is that of an upscale European providore or boutique sommelier. The serif title ('Discover', product names) introduces refined heritage and artisanal craft, while the neutral modern sans for numbers and labels keeps checkout and discovery pragmatic and fast. Substitutes should prioritize high contrast strokes like Roslindale or Playfair.

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

DEPTH
Depth is handled with exceptional softness. Most elements sit directly on the warm #FBF9F7 ground; product cards use a barely perceptible elevation (box-shadow: 0 4px 16px rgba(0, 0, 0, 0.02)) to remain clean and tactile rather than heavily lifted.

IMAGERY
Packaged items and wine bottles are captured as hyper-clean studio packshots floating against transparent or imperceptible white backgrounds. Lighting is soft, high-key diffused with faint physical contact shadows at the base of bottles and trays; lifestyle or cluttered photo backgrounds are entirely excluded.

SIGNATURE DETAIL — the thing that makes this design itself
The distinctive top-right wine-colored (#85273C) discount tab that seamlessly conforms to the card's 24px rounded corner, paired with delicate wine-colored heart lineart and editorial serif titles.

MUST
- Use warm bone white (#FBF9F7) rather than harsh blue-tinted cool grays for canvas backgrounds.
- Pair high-contrast editorial serif headings with crisp geometric sans price labels.
- Keep product photography cleanly masked or studio-isolated with natural soft ground contact shadows.
- Use 24px border radius consistently on all product tile cards.

AVOID
- Do not introduce harsh drop shadows; keep elevation soft with blur radii >= 12px and opacity <= 4%.
- Never use generic fluorescent sale badges; always conform to the dark wine rectangular corner tab.
- Do not use full-width heavy colored banners that disrupt the editorial light aesthetic.
- Avoid using serif typography for small UI metadata like percentages and prices.

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.

在 DraPub 中尝试

看看同一视觉方向里的其他提示词。

返回提示词画廊

移动端界面设计参考

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.

移动端界面设计参考

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.

移动端界面设计参考

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.

移动端界面设计参考

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.