Components
Button
Clickable element for triggering actions and navigation
Button
Icon Position
Text Size
Primary
Outline
Translucent
Link
Neutral
Brand
Error
Warning
Success
Info
Button group
Primary
Outline
Neutral
Brand
Error
Warning
Success
Info
Semantic colors
| Light | Dark | |||||||
|---|---|---|---|---|---|---|---|---|
| Shade | Alpha | ×C | Shade | Alpha | ×C | |||
| Buttons | ||||||||
| button-primary-light | 8 | 1 | 1 | 10 | 1 | 1 | ||
| button-primary-dark | 9 | 1 | 1 | 11 | 1 | 1 | ||
| button-primary-foreground | 1 | 1 | 1 | 1 | 1 | 1 | ||
| button-primary-highlight | 5 | 1 | 1 | 8 | 1 | 1 | ||
| button-primary-outline | 12 | 0.2 | 1 | 7 | 0.2 | 1 | ||
| button-outline-highlight | 6 | 1 | 1 | 11 | 1 | 1 | ||
| button-outline-outline | 5 | 0.2 | 1 | 7 | 0.2 | 1 | ||