Branding Colors
Primary Color

Primary 10
var(--primary-10)
hsl(190, 100%, 10%)
rgb(0, 43, 51)
#002B33

Primary 20
var(--primary-20)
hsl(190, 100%, 20%)
rgb(0, 85, 102)
#005566

Primary 30
var(--primary-30)
hsl(190, 100%, 30%)
rgb(0, 128, 153)
#008099

Primary 40
var(--primary-40)
hsl(190, 100%, 40%)
rgb(0, 170, 204)
#00AACC

Primary 50
var(--primary-50)
== var(--primary)
hsl(190, 100%, 50%)
rgb(0, 213, 255)
#00D5FF

Primary 60
var(--primary-60)
hsl(190, 100%, 60%)
rgb(51, 221, 255)
#33DDFF

Primary 70
var(--primary-70)
hsl(190, 100%, 70%)
rgb(102, 230, 255)
#66E6FF

Primary 80
var(--primary-80)
hsl(190, 100%, 80%)
rgb(153, 238, 255)
#99EEFF

Primary 90
var(--primary-90)
hsl(190, 100%, 90%)
rgb(204, 247, 255)
#CCF7FF
Accent Color

Accent 10
var(--accent-10)
hsl(160, 100%, 10%)
rgb(0, 51, 34)
#003322

Accent 20
var(--accent-20)
hsl(160, 100%, 20%)
rgb(0, 102, 68)
#006644

Accent 30
var(--accent-30)
hsl(160, 100%, 30%)
rgb(0, 153, 102)
#009966

Accent 40
var(--accent-40)
hsl(160, 100%, 40%)
rgb(0, 204, 136)
#00CC88

Accent 50
var(--accent-50)
== var(--accent)
hsl(160, 100%, 50%)
rgb(0, 255, 170)
#00FFAA

Accent 60
var(--accent-60)
hsl(160, 100%, 60%)
rgb(51, 255, 187)
#33FFBBrgb(102,255,204)

Accent 70
var(--accent-70)
hsl(160, 100%, 70%)
rgb(102, 255, 204)
#66FFCC

Accent 80
var(--accent-80)
hsl(160, 100%, 80%)
rgb(153, 255, 221)
#99FFDD

Accent 90
var(--accent-90)
hsl(160, 100%, 90%)
rgb(204, 255, 238)
#CCFFEE
Last updated