Design a light-mode mobile app interface screen: aged spirits framed like fine print on soft warm parchment under a nocturnal damson canopy.
LAYOUT
The screen begins with a 44px dark wine canopy framing native status and header actions, immediately rolling into a top-rounded 28px cream canvas. The top fold features an asymmetrical split layout: product naming, pricing, inventory guarantees, and buying controls span the left column while the vertical bottle silhouette towers over the right. Below this anchor, content progresses down a clean single-column rhythm of 20px-radius white cards dedicated to distillation facts, serving suggestions, and tasting notes.
PALETTE (use these exact hex values)
- #26121D — Damson Canopy: Status bar and uppermost header backdrop, creating intimate dark framing
- #F9F8F6 — Porcelain Canvas: Dominant warm-tinted sheet background for all primary product views
- #FFFFFF — Card White: Elevated grouping tiles for product specs, tasting notes, and serving rituals
- #4A1727 — Blackberry Wine: Primary Add to Basket CTA background and active carousel pagination dot
- #A88863 — Malted Ochre: All-caps category trackers, section eyebrows, and subtle craft badges
- #1A1819 — Charcoal Ink: Product headline typography, prices, and core attribute headers
- #7A7577 — Muted Truffle: Secondary description copy, ingredients lists, and inactive icons
- #1F7A4D — Cellar Green: Inventory affirmation dot and in-stock notification text
- #DECDBE — Tasting Sand: Circular icon badge backgrounds and inactive carousel indicator dots
TYPOGRAPHY
Typeface Cormorant Garamond (or Playfair Display, Scotch Modern, Adobe Caslon Pro), weights 400/500/600. Sizes 10px caption, 12px body-sm, 13px body, 15px body-lg, 16px subheading, 22px heading, 28px heading-lg, 34px display. Tracking -0.015em at display sizes. The typography balances an old-world aristocratic provenance with contemporary digital precision. Cormorant Garamond delivers graceful serifs, elegant ascenders, and editorial warmth reminiscent of bespoke spirits labelling and private cellar catalogues. The clean neo-grotesque sans grounds this romance with crisp, readable prices, legibility in low light, and effortless transactional trust.
GEOMETRY & SPACING
Corner radii — cards 20px, links 0px, inputs 10px, buttons 10px. Spacing on a 4px unit, 16px gaps, 24px between sections, 390px container, comfortable density.
DEPTH
Depth is achieved entirely through chromatic contrast and authentic photographic light rather than layered software drop shadows. Pure white cards (#FFFFFF) sit crisply atop the soft cream canvas (#F9F8F6) with negligible or zero blur offsets. Real-world glass refractions and golden liquid shadows cast by the bottle photography provide all required tactile dimensional realism.
IMAGERY
Photography emphasizes genuine studio-lit glass bottles with luminous amber liquids, realistic specular highlights, and soft natural grounding shadows. Lifestyle imagery introduces clear heavy-bottomed crystal glassware, single artisanal ice rocks, and natural amber pours. Flat illustrations, cartoonish badges, or stock 3D renders would immediately shatter the connoisseur atmosphere.
SIGNATURE DETAIL — the thing that makes this design itself
The signature element is the high-contrast canopy transition: an ink-deep damson app bar (#26121D) that frames a sweeping cream parchment sheet (#F9F8F6) split neatly between tall bottle photography and refined serif typography. Commonly misused by making the entire page white or flattening the hero into a generic centered mobile slider, which strips away the bespoke decanter atmosphere.
MUST
- Retain the dark damson backdrop behind the top rounded sheet to preserve the luxury cellar ambiance.
- Pair Cormorant Garamond for titles with clean Inter sans-serif for numbers, buttons, and utility microcopy.
- Keep spec cards strictly on white (#FFFFFF) with 20px radii against the warm cream (#F9F8F6) page canvas.
- Reserve deep blackberry (#4A1727) exclusively for transactional drivers like the Add to Basket button.
AVOID
- Do not use saturated bright reds or generic blues; all hues must feel aged, fermented, or botanical.
- Never substitute the serif headline with a modern grotesque font; it loses its distiller heritage.
- Avoid harsh black drop shadows; elevate cards solely via stark surface contrast (#FFFFFF against #F9F8F6).
- Do not crowd the hero split layout; allow the bottle photo to claim 50% width uninhibited.
OUTPUT
Render as a clean, pixel-crisp UI design at roughly 1488:3840. Flat vector rendering, real legible text, no browser chrome, no device mockup frame, no watermark, no lorem ipsum placeholder blocks. Try in DraPub