Design a light-mode web interface screen: gallery-grade spatial minimalism pairing architectural monochrome textures with razor-sharp editorial scale and cobalt kinetic accents.
LAYOUT
Structured around a persistent 88px left navigation rail and an airy horizontal rhythm. The main canvas begins with a minimal utility header dividing categories and dates via hairline dividers. Below, the layout balances an oversized title and an anchored hero image card against a structured column containing editorial body copy, micro stat sparklines, and directional controls at the base.
PALETTE (use these exact hex values)
- #FAFAFA — Canvas Ground: Primary background plane providing high-key gallery ambience across the entire viewport
- #FFFFFF — Card Surface: Raised containers for stat modules, hero imagery, and sidebar chrome
- #131722 — Obsidian Ink: Display titles, primary headlines, logo mark block, and stat numeric totals
- #7D8494 — Muted Slate: Sidebar labels, metadata, secondary descriptive copy, and inactive indicators
- #1F65EC — Cobalt Blue: Primary call-to-action button, active pagination track, active menu indicator, and key links
- #E6E8ED — Hairline Rule: Structural 1px dividers separating top header, metadata sections, and inactive progress paths
- #FF8E7D — Atmosphere Blush: Soft ambient radial glow under the display wordmark adding warmth to the neutral grid
- #F43F5E — Sparkline Rose: Heart icon background and trendline sparkline within the favorites metric card
- #10B981 — Sparkline Emerald: Arrow icon badge and trendline sparkline within the published metric card
TYPOGRAPHY
Typeface Plus Jakarta Sans (or Gilroy, General Sans, Inter), weights 400/500/600/700. Sizes 12px caption, 13px body-sm, 14px body, 18px body-lg, 24px subheading, 32px heading, 104px display. Tracking -0.03em at display, -0.01em at body, 0.02em at caption. The type language speaks with the confident precision of an architectural monograph or high-end design journal. Using a clean geometric sans with tight negative tracking gives the monumental title structural gravitas, while roomy line-heights in body text maintain effortless legibility. Licensed alternatives include Gilroy and General Sans; Inter serves as an acceptable open-source stand-in.
GEOMETRY & SPACING
Corner radii — cards 20px, links 4px, inputs 8px, buttons 10px. Spacing on a 8px unit, 24px gaps, 64px between sections, 1440px container, airy density.
DEPTH
Depth is created almost entirely through planar separation and framing rather than artificial drop shadows. Clean 1px hairlines (#E6E8ED) and shifts from off-white ground (#FAFAFA) to pure white (#FFFFFF) define surfaces. A single diffused radial gradient behind the hero title introduces atmospheric depth without physical layering.
IMAGERY
Exclusively monochromatic, tactile 3D renders or high-contrast architectural photography with rich striations and ribbed textures. Visuals emphasize volumetric geometry, soft shadows, and clean silhouettes against pale backdrops. Color lifestyle imagery or candid photography is entirely off-brand.
SIGNATURE DETAIL — the thing that makes this design itself
The soft warm-peach atmospheric radial blush hovering like dawn light directly behind the massive, crisp obsidian 'Molisem' title. It softens what would otherwise be a severe, sterile monochrome grid. Commonly misused by making the glow too saturated, too sharp at the boundaries, or by using multi-color rainbow gradients instead of a single restrained whisper.
MUST
- Retain strict black-and-white tonal purity for architectural photography to avoid competing with accent colors.
- Limit the vibrant cobalt (#1F65EC) exclusively to interactive affordances and key metrics.
- Use generous corner radii (20px to 24px) on featured visual cards to contrast the rigid 1px grid hairlines.
- Ensure the hero wordmark is massive (~104px) with tightly kerned tracking (-0.04em) for editorial monumentality.
AVOID
- Do not introduce multi-color photography; color is strictly reserved for UI state tokens and graphic sparks.
- Never add heavy drop shadows or dark elevation glows to cards; rely entirely on 1px borders and surface shifts.
- Do not shrink the display font below 72px on desktop; it must serve as an architectural element itself.
- Never use cobalt blue as a generic decorative background for cards or large sections.
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. 在 DraPub 中尝试 
