Typography
Rules of typesetting throughout the system.
Heading
Used to introduce pages or sections.
| Example | Token |
|---|---|
| Heading 7XL | heading.7xl |
| Heading 6XL | heading.6xl |
| Heading 5XL | heading.5xl |
| Heading 4XL | heading.4xl |
| Heading 3XL | heading.3xl |
| Heading 2XL | heading.2xl |
| Heading XL | heading.xl |
| Heading lg | heading.lg |
| Heading md | heading.md |
| Heading sm | heading.sm |
Text
Designed for multiple lines of text, having a higher line height than Label.
| Example | Token |
|---|---|
| Text 3XL | text.3xl |
| Text 2XL | text.2xl |
| Text XL | text.xl |
| Text lg | text.lg |
| Text md | text.md |
| Text sm | text.sm |
| Text xs | text.xs |
Button
Only to be used within components that render buttons.
| Example | Token |
|---|---|
| button.md | |
| button.sm | |
| button.xs |