Color
Primary Color Palette
Brand Colors
This typically includes one or two primary brand colors. These colors should reflect your brand's identity and personality.
Blue
#099DEC
hsl(201, 93%, 48%)
--color-blue
Contrast Ratio: 2.98
Neutrals
Black
#030303
hsl(0, 0%, 1%)
--color-black
Contrast Ratio: 20.62
White
#FCFCFC
hsl(0, 0%, 99%)
--color-white
Contrast Ratio: 1.03
Grey
#9F9F9F
hsl(0, 0%, 62%)
--color-grey
Contrast Ratio: 2.65
System
Green
#00C853
hsl(145, 100%, 39%)
--color-green
Contrast Ratio: 2.24
Yellow
#FFD700
hsl(51, 100%, 50%)
--color-yellow
Contrast Ratio: 1.40
Red
#EB1000
hsl(4, 100%, 46%)
--color-red
Contrast Ratio: 4.56
Orange
#FFA500
hsl(39, 100%, 50%)
--color-orange
Contrast Ratio: 1.97
Alias
primary, secondary, action, error, success, info, warning, neutral, highlight, feedback?
Mapping UI
text, border, surface, icon?, shadow?
headings, body, action, action-hover, action-active, error, success, info, warning, neutral, highlight, feedback?