1. The void type scale (from base.css)

text-display* also set font-weight: var(--weight-display). text-5xl…text-9xl do not exist (the default scale is removed) and emit nothing.

Mobile check: display sizes land at 0.5–0.75× desktop (measured mobile H1 28–48px). If a word is longer than ~11 characters, test text-display-xl at 320px for overflow.

2. What the best sites measured (for judging overrides)

Takeaways: display lh 0.85–1.15; display tracking −0.01 to −0.06em (median −0.023); weights 300–600; body 16px/1.5; workhorse 13–14px; mono labels +0.1 to +0.15em.

Tracking by size (grotesk; serifs need about half):

≤ 13px   +0.01 … +0.02em        14–16px  0 … −0.01em
18–24px  −0.005 … −0.015em      32–40px  −0.015 … −0.02em
48–64px  −0.02 … −0.03em        ≥ 72px   −0.03 … −0.05em
uppercase / mono labels  +0.05 … +0.15em

Line-height by size: display 0.9–1.05; H2 1.0–1.15; H3 1.25–1.3; UI 1.33–1.43; body 1.5–1.65; long-form 1.6–1.75.

3. Pairings (all SIL OFL 1.1, on next/font/google unless noted)

Avoid as defaults (overused in generated sites): Inter for everything with no features, Poppins, Montserrat, Plus Jakarta Sans, Space Grotesk as body, Nunito. Fontshare fonts (Satoshi, General Sans, Cabinet, Clash) use the ITF Free Font License, which forbids subsetting: do not ship them in open-source repos. Berkeley Mono is not free for editors/terminals/OSS.

Budget: ≤ 2 families + mono, ≤ 4 files, variable woff2, subsets: ["latin"], display: "swap". Measured latin woff2: Geist 28.7 KB, Geist Mono 22.6, Inter 47.1, JetBrains Mono 39.5, Instrument Serif 20.5. Never request extra axes without measuring (Inter + opsz 47 → 71 KB; Bricolage all axes 40 → 128 KB). Monospace via next/font/local needs adjustFontFallback: false (see speed).

4. Rules with snippets

// Hero lockup: width in ch, balance from base layer, sub ≤ 2 lines
<h1 className="max-w-[16ch] text-display-lg text-fg">Deploy previews for every branch.</h1>
<p className="mt-6 max-w-[44ch] text-lg text-fg-muted">Push a branch, get a URL in 14 seconds.</p>

// Two-tone heading (Linear/Stripe): one element, second phrase muted
<h2 className="max-w-[24ch] text-display-sm text-fg">
  Built for review. <span className="text-fg-muted">Every change gets a link, a diff and a rollback.</span>
</h2>

// Mono label voice
<p className="label-mono text-fg-muted">01 · Pipelines</p>

// Stat: tabular, unit smaller, label mono
<p className="text-display text-fg tabular-nums">14<span className="ml-1 text-2xl text-fg-muted">s</span></p>
<p className="label-mono mt-2 text-fg-subtle">median preview build</p>

// Long-form article column
<article className="mx-auto max-w-prose text-lg text-fg [&_p+p]:mt-6 [&_h2]:mt-16 [&_h2]:text-3xl">…</article>

• OpenType: add per project in globals.css, only for faces that have them: body { font-feature-settings: "cv11", "ss01"; } (Inter), "ss01" (Geist alternates). Numbers that change or align: tabular-nums; IDs/code: slashed-zero.
• Italic: load italics only if used (style: ["normal","italic"] costs a file).
• Emphasis: by color (text-fg vs text-fg-muted) and weight (font-medium), before size. Max 2 weights in UI text.
• Uppercase: only via label-mono (tracked). Never uppercase headings or buttons.
• Links in prose: always underlined (TextLink), underline-offset-4, decoration color brand-line, hover to currentColor.
• Characters: … “ ” ’ en dash – for ranges,   between number and unit, × for dimensions.
• Visually hidden semantic H1 (hellohello pattern) is allowed for an art-directed poster hero:

  Acme — Design studio in Montevideo

  plus the visual lockup with aria-hidden="true". Exactly one H1 per page (lint/multiple-h1).

5. Fluid overrides

Only for display sizes, always with a rem term (zoom-safe), max ≤ 2.5× min:

slope = (maxPx − minPx) / (maxVw − minVw);  intercept = minPx − slope × minVw
font-size: clamp(min/16 rem, intercept/16 rem + slope×100 vw, max/16 rem)

A poster hero bigger than text-display-xl (hellohello 7.24vw ≈ 104px at 1440): text-[clamp(3rem,1.2rem+6.2vw,6.75rem)] leading-[0.9] tracking-[-0.03em]. Test at 320px.