Colour Palette
The colour palette is here to guide you when you are creating new components. If that’s not your thing, it might still be helpful to understand how the different colours are applied. If you are creating new components, please keep in mind that we need to comply with WCAG 2.1 AA.
WCAG 2.1 requires a contrast ratio of at least 3:1 for graphics and user interface components, such as form input borders or action icons, and a contrast ratio of 4.5:1 for normal and large text. Note that disabled states and decorative elements are both exceptions to these requirements.
Brand & Accent
Midnight-Blue
#101948
16, 25, 72
100, 90, 0, 50
Deep-Purple
#7344F3
115, 68, 243
65, 75, 0, 0
Corn-Flower
#6161EF
97, 97, 239
70, 70, 0, 0
Coral-Pink
#F4C9B3
244, 201, 179
0, 25, 35, 0
Corn
#F4DF67
244, 223, 103
5, 10, 70, 0
Charlotte
#97E7F2
151, 231, 242
38, 5, 0, 5
Neutrals
Black
#000000
0, 0, 0
Dark-Gray
#555555
85, 85, 85
Light-Gray
#C8C7C6
200, 199, 198
Light-Sand
#F4F0ED
244, 240, 237
White
#FFFFFF
255, 255, 255