Typefaces

Canonical docs now live at videoml.org/docs/stdlib.

Typeface schemes are packaged as CSS variables (--font-eyebrow, --font-headline, --font-subhead) so layouts stay typography-agnostic.

Scheme Catalog

Option A — Broadcast Classics

Classic News
Neutral, authoritative news tone. Use for anchors, headlines, and steady narration.
Authority
High-impact urgency for promos, alerts, and breaking updates.
Documentary
Warm, readable narration style for long-form storytelling.
Serif Accent
Trustworthy headlines with a classic serif emphasis.
Headline + Caption
Big uppercase headlines with compact caption subheads.
Sports Ticker
Condensed, fast-paced overlays for live score and stats.
Debate
Screen-optimized neutral set for multi-speaker segments.
Magazine
Elegant feature feel for editorial and brand stories.
Finance
Clean data clarity for numbers, tickers, and charts.
Weather
Friendly rounded tone for forecast and explainer panels.
Ticker Serif
Mix of broadcast sans with heritage serif for credibility.
Tech Desk
Platform-native fonts for clean product demos.

Option B — Modern Sans & Slab

Modern Grotesk
Unified sans stack for UI-first explainer content.
Slab Partner
Slab headline with clean sans subheads for contrast.
Humanist
Warm humanist sans for friendly explainers.
Heritage
Classic serif headline with neutral sans support.
Condensed
Tight, tall headlines for data-heavy overlays.
Display
Bold display headline for promos and hero frames.
Rounded
Friendly rounded style for approachable messaging.
Slate
Professional, understated sans stack for docs.
Hybrid
Modern sans paired with a high-contrast serif headline.
Geo Sans
Geometric sans for bold tech stories.
Slate Serif
Serif headline with neutral sans for contrast.
Studio Default
Default UI feel for clean product walkthroughs.

Option C — History / Cinema / Trends

History
Classic documentary tone with serif headline.
Cinema
Futura headline with modern cinematic pacing.
Current Trend
Contemporary sans stack for modern explainers.
Minimal Serif
Clean serif headline with modern sans support.
Broadcast Quote
Quote frames with serif emphasis and neutral sans.
Lower Third
Classic lower-third stack for nameplates.
Pop Culture
High energy display for entertainment content.
Luxury
Elegant serif with refined supporting sans.
News Quote
Quote-heavy segments with clear serif headline.
Data Viz
Technical, condensed numerics for charts.
Esports
Futuristic display for gaming highlight reels.
Lifestyle
Soft, approachable vibe for wellness & lifestyle.

How to Apply

.theme-classic-news {
  --font-eyebrow: "Gill Sans", "Helvetica Neue", Arial, sans-serif;
  --font-headline: "Helvetica Neue", Arial, sans-serif;
  --font-subhead: Arial, "Helvetica Neue", sans-serif;
}

When to Choose

  • Hard news / corporate: Classic News, Authority, Finance, Tech Desk.
  • Promo / hype: Authority, Display, Pop Culture, Cinema.
  • Longform / docu: Documentary, Serif Accent, Magazine, History.
  • Data / UI overlays: Tech Desk, Data Viz, Modern Grotesk, Geo Sans.
  • Quotes / lower-thirds: Broadcast Quote, News Quote, Lower Third, Heritage.
  • Friendly / lifestyle: Rounded, Weather, Lifestyle.