Base Colors
These colors define a palette for building UIs. Colors are numbered in alignment with lightness value in the range of 0-100. For example, color-charcoal-30 has about 30% lightness.
color-charcoal-*
10
#1c1e23
20
#28343e
30
#494f5c
40
#626a73
50
#777f92
60
#a0a4b1
70
#bdbfc1
80
#dddfe3
90
#f2f3f5
color-cobalt-*
10
#071e31
20
#0b2f4c
30
#165c96
40
#1b73bb
50
#4278d6
60
#64a8e1
70
#a1c6ed
80
#cee0f4
90
#e2ecf9
color-gold-*
10
#3c3002
20
#735d07
30
#a8880b
40
#d8ac00
50
#ffce0c
60
#f9d543
70
#ffe372
80
#fff0b2
90
#fffae9
color-firebrick-*
10
#330005
20
#660009
30
#b3000f
40
#c71a28
50
#d24b57
60
#d36464
70
#e18e8e
80
#e7bbbb
90
#f2dede
color-emerald-*
10
#0b3003
20
#145a06
30
#208f0a
40
#2bbf0d
50
#40df20
60
#66e54c
70
#8fe87d
80
#b8eaae
90
#dff0d8
color-amethyst-*
10
#130e1b
20
#302343
30
#4d386b
40
#664a8d
50
#8358bb
60
#986ece
70
#ae94d1
80
#cfc1e1
90
#dcd3e8
color-white #ffffff
color-black #000000