# Design Language for cbdc.bar ## Aesthetics and Tone A retro-futuristic command center for Central Bank Digital Currency -- imagine a 1970s NASA mission control redesigned for monitoring global currency flows. The visual language channels the optimism of mid-century futurism: rounded CRT-screen corners, amber-on-dark readouts, and the satisfying click of analog toggle switches, all applied to the bleeding-edge topic of CBDCs. Ma (negative space) principles from Japanese design govern the composition, giving each data element room to breathe like instruments on a well-designed control panel. Muted vintage tones -- burnt sienna, olive drab, faded gold -- replace the typical blue-and-white fintech palette. The tone is scholarly-intellectual: this is a research station, not a trading floor. ## Layout Motifs and Structure The layout uses ma-negative-space principles: generous 120px margins on desktop, with content occupying only 60% of the viewport width, leaving intentional emptiness that draws focus to each element. The page is structured as a vertical stack of "control panels" -- self-contained sections separated by 160px of negative space. Each panel has a retro rounded rectangle frame (border-radius: 24px) with a 2px border in #8b7d5a. The hero section is a single centered statement floating in vast emptiness. Data sections use a 2-column layout within their panels (50/50 split with 48px gap). Navigation is a vertical sidebar on the left with rotated text labels, visible only on desktop. On mobile, it collapses to a bottom tab bar. Sharp angular cuts at 15-degree angles accent certain panel corners, creating a retro-futuristic edge detail. ## Typography and Palette **Typography:** - **Headlines:** "Bungee" (Google Fonts) -- a bold display typeface with a retro-futuristic personality, layered and graphic. Used at 2rem-4.5rem, weight 400, letter-spacing: 0.02em, text-transform: uppercase. - **Body:** "Atkinson Hyperlegible" (Google Fonts) -- designed for maximum legibility with distinctive letterforms, perfect for scholarly data-heavy content. Used at 1rem-1.1rem, weight 400, line-height 1.7. - **Data/Readouts:** "Share Tech Mono" (Google Fonts) -- a technical monospace that evokes vintage digital displays. Used at 0.85rem-1.2rem, weight 400, letter-spacing: 0.06em. **Palette:** - Panel Dark: #2a2520 (dark walnut) -- panel backgrounds, primary text on light - Olive: #6b6b45 (vintage olive) -- secondary accents, borders - Amber: #d4a340 (control panel amber) -- active states, highlights, data readouts - Sienna: #a0522d (burnt sienna) -- links, interactive elements - Cream: #f0e8d8 (aged parchment) -- page background - Faded Gold: #c4a95a (muted gold) -- decorative borders, premium indicators - Light: #e8e0d0 (warm beige) -- section alternate backgrounds ## Imagery and Motifs Collage elements combine vintage currency engravings (recreated as SVG line art) with retro-futuristic control panel components -- toggle switches, rotary dials, and CRT screen frames rendered as CSS/SVG decorations. Sharp angular motifs appear as 15-degree diagonal cuts on card corners and section dividers, creating a dynamic tension against the rounded CRT-frame containers. Illustrations use a limited two-tone approach: all graphics rendered in #2a2520 and #d4a340 only, evoking the amber monochrome of vintage computer terminals. Background textures include a subtle scan-line effect (1px horizontal lines at 3% opacity) across data panels and a paper grain texture on the main background. Control panel metaphors: status indicators as colored dots (green/amber/red), data readouts in monospace within rounded-rect frames. ## Prompts for Implementation Build the page as a retro mission control experience. The hero section presents the site title "CBDC.BAR" in Bungee at massive scale, centered in a sea of negative space, with a slow elastic breathing animation (scale 1.0 to 1.02, 4s cycle). Control panels scroll into view with a vintage CRT power-on effect: a horizontal line expands from center to full width, then the content fades in from 0 opacity over 500ms. Data readouts use elastic number animations -- values count up with spring overshoot. Toggle elements click between states with a satisfying 100ms scale(0.95) press animation. Section transitions respect the ma philosophy: long scroll gaps between panels create contemplative pauses. The vertical sidebar navigation uses text rotated 90 degrees with underline-draw hover animations. Avoid CTA-heavy layouts, pricing blocks, and stat-grids. This is a scholarly research instrument panel, not a cryptocurrency exchange. ## Uniqueness Notes 1. **Retro-futuristic CBDC mission control:** No other design applies 1970s NASA command center aesthetics to central bank digital currency research, creating an entirely novel visual metaphor. 2. **Ma-negative-space composition:** The deliberate use of 160px section gaps and 60% content width creates a contemplative pacing unique among the batch's designs. 3. **Amber monochrome data palette:** Restricting data visualization to #2a2520 and #d4a340 evokes vintage terminal displays, distinct from modern multi-color dashboards. 4. **CRT power-on section reveals:** The horizontal-line-expand animation for revealing panels is a unique entry effect that reinforces the retro-futuristic narrative. Document chosen seed/style: aesthetic: retro-futuristic, layout: ma-negative-space, typography: retro-display, palette: muted-vintage, patterns: elastic, imagery: collage, motifs: sharp-angles, tone: scholarly-intellectual Avoided overused patterns: corporate aesthetic (76%), asymmetric layout (96%), mono typography (98%), warm palette (100%), parallax patterns (98%), tech motifs (97%), friendly tone (77%), minimal imagery (96%)