# Design Language for economic.day ## Aesthetics and Tone A financial-times broadsheet where economic news is typeset with editorial authority -- economic.day renders as a premium daily economic publication with the visual gravitas of the Financial Times: salmon-tinted paper, authoritative serif headlines, and dense but legible columnar layouts that respect the reader's intelligence. The financial-editorial aesthetic communicates that this information has value -- it is produced by experts and presented with care. The tone is analyst-measured: informed, precise, never sensational. Economic concepts are explained with the confidence of a veteran financial journalist who knows their reader is sophisticated. ## Layout Motifs and Structure **Broadsheet System:** 4-column layout at max-width 1120px, 24px gutters, with a strong masthead. **Section Flow:** 1. **The Masthead:** Full-width salmon-tinted header with "ECONOMIC.DAY" in serif caps, market indicators row. 2. **The Lead:** Lead article spanning 3 columns, sidebar brief in column 4. 3. **The Markets:** Data-dense section with mini-charts (CSS bar charts) and figure tables. 4. **The Analysis:** 2-column in-depth analysis sections. ## Typography and Palette - **Headlines:** "Playfair Display" at 2rem-3.5rem, weight 700. - **Body:** "Source Serif 4" at 0.95rem, weight 400, line-height 1.65. - **Data:** "Tabular Nums" (via Inter) at 0.85rem for financial figures. **Palette:** Salmon (#fff0e0), Ink (#1a1818), FT Pink (#f2d1b3), Dark Rule (#2a2018), Green (#208040) for positive, Red (#c02020) for negative. ## Imagery and Motifs **Salmon Background:** The distinctive FT-style tinted background differentiates this from all other news-style designs. **Market Indicator Row:** A horizontal ticker-style row below the masthead with CSS-rendered mini metrics (green/red arrows + numbers). **Column Rules:** 1px vertical dividers between columns in muted brown. **Figure Tables:** Clean data tables with alternating row backgrounds and right-aligned numbers using tabular-nums font-feature-settings. ## Prompts for Implementation Build as a premium financial daily. No animations -- content is present immediately (newspapers do not animate). The salmon background establishes identity. Dense 4-column layout creates the information-rich experience of financial journalism. Market indicators update position (CSS animation: translateX for horizontal scroll). Data tables are precise and readable. Everything communicates reliability and expertise. ## Uniqueness Notes 1. **Salmon-tinted financial editorial:** The FT-inspired salmon paper color creates immediate financial-authority recognition. 2. **Market indicator ticker row:** A CSS-animated horizontal metrics bar below the masthead is distinctive. 3. **4-column broadsheet density:** Authentic newspaper-level column density is rare on the web. 4. **Tabular-nums financial data:** Using OpenType tabular figures for aligned financial data shows typographic precision. Document chosen seed/style: aesthetic: financial-editorial, layout: broadsheet-4col, typography: financial-serif, palette: salmon-ink, patterns: column-rules, imagery: market-indicators, motifs: data-tables, tone: analyst-measured