Design a light-mode web interface screen: sculptural dried florals staged in serene bone-white spaces punctuated by high-contrast electric cobalt actions.
LAYOUT
The rhythm alternates between balanced two-column splits and even multi-column grids bounded within a 1200px shell. The page opens with an asymmetric hero pairing left-aligned typography with a monumental right-side curved photo composite. Below, content transitions rhythmically from a 3-column service grid into a single full-width arched banner, continuing into a 4-column product rack.
PALETTE (use these exact hex values)
- #1856DB — Cobalt Blue: Exclusive action color for primary CTAs, icon fills, active badges, and uppercase section kickers.
- #FFFFFF — Porcelain White: Primary surface background for cards, standard page canvas, and navigation bar.
- #EFF3F9 — Frost Periwinkle: Atmospheric tinted background for the hero underlay arch and promotional feature banners.
- #19202A — Deep Obsidian: High-contrast headings, product titles, brand mark, and high-priority interface labels.
- #5E6875 — Slate Smoke: Paragraph summaries, meta details, service descriptions, and price qualifiers.
- #E5E9F0 — Border Fog: Delicate hairlines defining secondary buttons, outline pills, and subtle card perimeters.
- #19202A — Rating Gold: Monochromatic filled star indicators alongside customer review metrics.
TYPOGRAPHY
Typeface Plus Jakarta Sans (or Outfit, DM Sans, Inter), weights 400/500/600/700. Sizes 11px caption, 13px body-sm, 15px body, 17px subheading, 32px heading, 48px display. Tracking -0.03em at display, 0.08em at kicker. The geometric sans-serif (Plus Jakarta Sans) conveys a modern Scandinavian gallery aesthetic. Tight tracking at display sizes lends a crisp architectural confidence, while open line heights in body text ensure effortless readability for bespoke service descriptions. If substituted, fonts must preserve geometric circular bowls without turning whimsical.
GEOMETRY & SPACING
Corner radii — cards 16px, links 4px, inputs 8px, buttons 8px. Spacing on a 8px unit, 24px gaps, 80px between sections, 1200px container, comfortable density.
DEPTH
Depth is handled predominantly through crisp flat layering rather than dramatic drop shadows. The sole elevated element is the floating collection dock widget over the hero image, which leverages an ultra-soft ambient blur (y: 10px, blur: 25px, alpha: 0.06). All other elements sit flush upon alternating white and pale periwinkle canvas zones.
IMAGERY
Photography features architectural, tactile dried florals (pampas grass, bleached palm spears, craspedia) staged inside matte ceramic, textured travertine, and rippled plaster vases. Lighting is diffused and soft, producing muted bone, sand, and linen hues. High-saturation green foliage or glossy commercial plastic props are strictly forbidden.
SIGNATURE DETAIL — the thing that makes this design itself
The asymmetric periwinkle backdrop arch behind photographic floral arrangements paired with an electric cobalt pill dock. This deliberate collision between warm, rustic dried botanical stillness and sharp, modernist digital blue is the visual thesis of the brand. Misusing it by replacing the arch with a box or muting the cobalt kills the modern boutique tension.
MUST
- Reserve vibrant cobalt (#1856DB) strictly for interactive touchpoints, kickers, and focused accent vectors.
- Pair ceramic, stone, and dried botanical photography with pale periwinkle (#EFF3F9) curved background shapes.
- Maintain uniform 16px border-radius across all card images and standard feature panels.
- Use uppercase, widely tracked 11px micro-copy for section labels to anchor visual hierarchies.
AVOID
- Do not introduce traditional warm floral pastels or green plant accents that clash with dried earth tones.
- Do not apply dark, muddy drop shadows; use crisp borders or ambient 6% alpha tints.
- Do not use serif typefaces; editorial poise here relies strictly on geometric grotesques.
- Do not style secondary or tertiary buttons in filled shades that compete with the cobalt CTA.
OUTPUT
Render as a clean, pixel-crisp UI design at roughly 1936:3840. Flat vector rendering, real legible text, no browser chrome, no device mockup frame, no watermark, no lorem ipsum placeholder blocks. Try in DraPub