Color

Palettes and guidelines on how to use color across the interface

Shades

colorScales / blue
100
#f2f8fd
200
#cde4f7
300
#87bfec
400
#449be1
500
#1a77ca
600
#155ea0
700
#0f4778
800
#093051
900
#041a2d
colorScales / purple
100
#f8f5fd
200
#e7def8
300
#c5aeee
400
#a683e5
500
#895ed3
600
#7043b7
700
#572b97
800
#3b1d66
900
#21103a
colorScales / green
100
#eefaf5
200
#b8e7d3
300
#5ecd9e
400
#00ab62
500
#00874d
600
#006a3d
700
#00502e
800
#00361f
900
#001e11
colorScales / yellow
100
#fff7d9
200
#ffdf62
300
#e5b203
400
#b98f02
500
#927002
600
#745801
700
#584201
800
#3b2c00
900
#201800
colorScales / orange
100
#fff5ed
200
#ffdabf
300
#ffa461
400
#ea7325
500
#c45317
600
#a13c14
700
#7e2812
800
#59170d
900
#340b07
colorScales / red
100
#fff3f3
200
#ffd8d8
300
#ff9f9f
400
#ff5d5d
500
#d63d3d
600
#aa3030
700
#802424
800
#571818
900
#310e0e

 

Neutrals

colorScales / navy
100
#f4f6f8
300
#a9bbcb
200
#dae2e9
400
#7c98b4
500
#557999
600
#3e607d
700
#2e475d
800
#1f303f
900
#111a23
colorScales / slate
100
#f5f6f8
200
#dee1e6
300
#b2b9c5
400
#8a96a7
500
#68778d
600
#515d70
700
#3d4653
800
#282f38
900
#16191f
colorScales / grey
100
#f7f7f7
200
#e1e1e1
300
#b9b9b9
400
#959595
500
#757575
600
#5c5c5c
700
#454545
800
#2e2e2e
900
#191919
white
#ffffff
black
#000000