Skip to main content
Status: Phase 1 — tokens landed. Phase 3 component migration pending. Owner: Platform Foundation (PF) Source of truth: src/index.css (--text-*, --leading-*, --tracking-*, --font-*).

​
Families

Tailwind utilities: font-sans (body), font-heading, font-mono. Never declare font-family inline — it bypasses PF-95 tenant typography overrides.

​
Type scale

Modular ratio ~1.2, optimized for Space Grotesk display + Inter body. H1–H4 in @layer base already consume the scale; new headings should use the same tokens, not raw text-[NNpx].

​
Tracking

  • Display (text-2xl+): --tracking-tight (≈ -0.015em). Already applied via h1/h2.
  • Body / UI: --tracking-normal.
  • Eyebrow / overline / ALL-CAPS labels: --tracking-wide (0.04em).
  • Monospace IDs: --tracking-mono (0.01em).

​
Font features

body enables Inter cv11 (single-storey ‘a’-disambiguating digits), ss01, cv02. Headings use ss01, ss02. Tabular numerals are opt-in: add font-variant-numeric: tabular-nums (or .font-tabular) on cells where alignment matters.

​
Color contrast (Phase 1 fixes)

  • --text-secondary tightened light 215 22% 38%, dark 215 20% 72% for WCAG AA.
  • Dark --primary lifted to 222 70% 60% so CTAs stand off elevated cards.
  • --chart-3 / --chart-5 darkened in light mode for AA on white.
  • --chart-N-foreground added — use as the text/label color when drawing on a --chart-N fill.

​
Migration rules (Phase 3)

  1. No new text-[NNpx] arbitrary sizes; use the scale.
  2. No new font-family: declarations; use the tokens.
  3. Promote any heading drawn via styled <div> to a real <h1>–<h4> so base styles apply.
  4. Long-form prose (compliance docs, audit narratives) → wrap in .prose with --leading-relaxed.
See also: SEMANTIC_COLORS.md, ICON_GUIDE.md.