Below you will find our named color definitions. They are meant to convey the meaning of the color using a defined naming convention. When working, please use these color definitions and try to avoid introducing new unamed colors.
All colors (except restricted colors) have CSS utility classes associated with them. text-{COLOR_NAME}
for text color and bg-{COLOR_NAME}
for background color.
#FFF
white
ES white
#C8DFFF
soft-blue
ES soft blue
#85B2FF
medium-blue
ES medium blue
#1B1763
dark-blue
ES dark blue
#FF9133
warm-orange
ES warm orange
#1B1763
blue-900
#162676
blue-800
#1D3297
blue-700
#2E46B9
blue-600
#4A62D4
blue-500
#688AEA
blue-400
#85B2FF
blue-300
#A7C9FF
blue-200
#C8DFFF
blue-100
#DDEDFF
blue-50
#ED7C2B
orange-900
#FF9133
orange-800
#FF9D51
orange-700
#FFAA66
orange-600
#FFB67B
orange-500
#FFC28B
orange-400
#FFCEA0
orange-300
#FFDBB5
orange-200
#FFE7CA
orange-100
#FFF3DF
orange-50
#222633
gray-900
#323543
gray-800
#515362
gray-700
#646776
gray-600
#878999
gray-500
#A7AABA
gray-400
#CFD1DF
gray-300
#DFE1EB
gray-200
#EAECF4
gray-100
#F1F3FB
gray-50
#00A759
success-900
#80CE97
success-500
#CCEDD8
success-50
#F4CA11
warning-900
#F4DF83
warning-500
#F8EFCA
warning-50
#DE3C50
error-900
#EFA6AF
error-500
#F7D7DB
error-50
Use only for charts and data.
#3EA2BD
myrtle-cactus-blue
ES myrtle cactus blue
#FFC021
sunny-yellow
ES sunny yellow
#CA77D1
petal-purple
ES petal purple
#4A9158
leaf-green
ES leaf green
#D4B595
white-oak
ES white oak
#9A6D51
earthy-brown
ES earthy brown