Foundations
Typography
Three families, each with a job: Inter for structure, Geist for operation, Geist Mono for code. Nothing below 12px.
Inter
Structure — display, headings, the app-header brand. Tight tracking at large sizes.
--font-displayGeist
Operation — body copy, labels, navigation, captions, tables. The workhorse.
--font-sansGeist Mono
Code, token names, and one-time-passcodes.
--font-monoPrinciples
- 7Inter for structure, Geist for operation, Geist Mono for code — with a 12px floor (
caption). - Headings use Inter with negative tracking; body and UI use Geist at a comfortable 1.6 line height.
- Fonts are self-hosted (no CDN) and loaded as variable fonts.
See the full type scale with live specimens on the Typography tokens page.