Typography
Font families, sizes, and weights used across the design system.
Font Families
The primary font is set via --font-primary and used for all UI text. A secondary font --font-secondary is available for display or branding.
Primary
Aa Bb Cc 123
var(--font-primary)
Monospace
Aa Bb Cc 123
font-mono
Type Scale
A harmonious scale from caption (12px) to display (36px).
Display
The quick brown fox
Heading 1
The quick brown fox
Heading 2
The quick brown fox
Heading 3
The quick brown fox
Heading 4
The quick brown fox
Body
The quick brown fox jumps over the lazy dog. Pack my box with five dozen liquor jugs.
Body Small
The quick brown fox jumps over the lazy dog. Pack my box with five dozen liquor jugs.
Caption
The quick brown fox jumps over the lazy dog.
Overline
CATEGORY LABEL
Font Weights
Available weights from regular to bold.
Ag
Regular (400)
Ag
Medium (500)
Ag
Semibold (600)
Ag
Bold (700)