All Tokens02 · Typography
A pairing that ships long-form, dashboards, and code.
Every family, size, weight, and line height, in full — the complete reference behind the hub's editorial sample.
Families & Sizes
Size scale
| Size | typography-font-family-sans · Manrope | typography-font-family-serif · Besley | typography-font-family-mono · 'JetBrains Mono' |
|---|---|---|---|
xs 12 fontSize: var(--typography-font-size-xs) | Sample | Sample | Sample |
sm 14 fontSize: var(--typography-font-size-sm) | Sample | Sample | Sample |
base 16 fontSize: var(--typography-font-size-base) | Sample | Sample | Sample |
lg 18 fontSize: var(--typography-font-size-lg) | Sample | Sample | Sample |
xl 20 fontSize: var(--typography-font-size-xl) | Sample | Sample | Sample |
2xl 24 fontSize: var(--typography-font-size-2xl) | Sample | Sample | Sample |
3xl 30 fontSize: var(--typography-font-size-3xl) | Sample | Sample | Sample |
4xl 36 fontSize: var(--typography-font-size-4xl) | Sample | Sample | Sample |
5xl 48 fontSize: var(--typography-font-size-5xl) | Sample | Sample | Sample |
6xl 60 fontSize: var(--typography-font-size-6xl) | Sample | Sample | Sample |
Attributes
Weights
extralight200
light300
regular400
medium500
semibold600
bold700
extrabold800
black900
Line Heights
none100
tight125
snug137.5
normal150
relaxed162.5
loose200