Typography
Set type by role with type-*, never by size or weight. Geist carries Su’s interface, display, and title roles. Geist Mono carries code and IDs. Type sizes and line heights stay consistent in light and dark.
type-display
Hero and marketing headlines.
Geist · 36/40 · 630 · -0.9px
Review 3 proposed changes
type-title
Page titles and empty states.
Geist · 24/32 · 630 · -0.48px
Review 3 proposed changes · 营造法式
type-heading
Sections and cards.
Geist · 16/24 · 630 · -0.16px
Access requests from last week
type-body
Running text and table cells.
Geist · 14/20 · 400 · 0
The assistant drafted these from last week’s access requests. Nothing changes until you approve.
type-button
Button action labels.
Geist · 14/18 · 500 · 0
type-label
Tabs, form labels, badges.
Geist · 13/16 · 530 · 0
Approve 3 changes
type-caption
Helper text and metadata.
Geist · 12/16 · 400 · 0.12px
Drafted 2 minutes ago by the assistant
type-code
Code, keys, IDs.
Geist Mono · 13/20 · 400 · 0
group:Eng-Legacy · ADMIN-01
Figures
Geist's stylistic sets ss03 and ss05 separate I, l and 1. Use figures-id for IDs and anything a reader might copy, and figures-tabular for numbers that line up or change.
Default
Il1 O0 · ADMIN-01 · 1,111.11
figures-id
Il1 O0 · ADMIN-01 · 1,111.11