Everything starts with identity
Make your design system, choose your color palette, your favourite icon library, your components style and fonts to match you brand identity.
Colors
Neutral
Neutral 100
Default background
Neutral 200
Secondary background, decorative border.
Neutral 300
Decorative border
Neutral 400
Field border
Neutral 500
Neutral 600
Disabled text
Neutral 700
Control border (switch, checkbox, radio)
Neutral 800
Secondary text
Neutral 900
Text
Neutral 1000
Heading
Accent
Accent 100
Muted background
Accent 200
Accent 300
Accent 400
Accent 500
Component background (default), Text
Accent 600
Component background (hover)
Accent 700
Component background (active)
Accent 800
Accent 900
Accent 1000
Success
Success 100
Muted background
Success 200
Success 300
Success 400
Success 500
Component background (default), Text
Success 600
Component background (hover)
Success 700
Component background (active)
Success 800
Success 900
Success 1000
Danger
Danger 100
Muted background
Danger 200
Danger 300
Danger 400
Danger 500
Component background (default), Text
Danger 600
Component background (hover)
Danger 700
Component background (active)
Danger 800
Danger 900
Danger 1000
Warning
Warning 100
Muted background
Warning 200
Warning 300
Warning 400
Warning 500
Component background (default), Text
Warning 600
Component background (hover)
Warning 700
Component background (active)
Warning 800
Warning 900
Warning 1000