Colors

We have a vibrant primary and secondary color palette that leaves room for lots of flexibility. More tints and shades are available as well, to give even more nuance to our brand and message.

‍

Primary Colors

Our primary palette is core to Vanta's identity and should always be followed to a T. The exact values for each primary color are below.
‍

Vanta Purple

#AC55FF

172r 85g 255b

76c 90m 0y 0k

PMS 265C

‍

Vanta Dark Purple

#240642

36r 6g 66b

98c 98m 0y 37k

PMS 273C

‍

Vanta White

#F8F4F3

248r 244g 243b

0c 2m 2y 243k

PMS N/A

‍

Secondary Colors

Our secondary color palette adds depth and variation to our message, and can be used for backgrounds. These colors should also be followed carefully—the exact values for each secondary color are below.
‍

Vanta Red

#F45B5B

244r 91g 91b

0c 69m 65y 0k

PMS 7416C

‍

Vanta Yellow

#FFBE0F

255r 190g 15b

0c 25m 94y 0k

PMS 1235C

‍

Vanta Green

#09C639

9r 198g 57b

66c 0m 90y 0k

PMS 2270C

‍

Tints and shades

Our tints and shades allow for versatility and depth in our brand storytelling, but should be used minimally as accent colors only. The exact values for each color are below—they should be followed carefully for consistency.
‍

Purple shade

#771FCB | 119r 31g 203b

Purple tint

#D5AAFF | 213r 170g 255b

#eeddff

10%

#e3c6ff

20%

#d6aaff

30%

#c88eff

40%

#ba71ff

50%

#8f47d5

60%

#7339aa

70%

#562b80

80%

#391c55

90%

Red shade

#B03243 | 176r 50g 67b

Red tint

#F9ADAD | 249r 173g 173b

#fddede

10%

#fbc8c8

20%

#faadad

30%

#f89292

40%

#f67676

50%

#cb4c4c

60%

#a33d3d

70%

#7a2e2e

80%

Green shade

#068D39 | 6r 141g 57b

Green tint

#84E29C | 132r 226g 156b

#cef4d7

10%

#adecbd

20%

#84e39c

30%

#5bd97b

40%

#32d05a

50%

#08a530

60%

#068426

70%

#05631d

80%

Yellow shade

#EF8909 | 239r 137g 9b

Yellow tint

#FFDE87 | 255r 222g 135b

#fff2cf

10%

#ffe9af

20%

#ffdf87

30%

#ffd45f

40%

#ffc937

50%

Dark purple tints and shades

#240642 | 36r 6g 66b

#d3cdd9

10%

#b6acc0

20%

#9283a1

30%

#6d5981

40%

#492f62

50%

Black

#000000 | 0r 0g 0b

Gray 4

#313035 | 49r 48g 53b

Gray 3

#726C78 | 114r 108g 120b

Gray 2

#928E97 | 146r 142g 151b

Gray 1

#D9D7DA | 217r 215g 218b

White

#FFFFFF | 255r 255g 255b

‍

Color usage

To maintain brand recognition and to make sure the brand isn't diluted over time, we follow a specific color ratio. A breakdown of best practices for color usage is below.

‍

When correctly paired with colors and text, our brand colors are contrasted enough to pass all accessibility standards—the combinations shown below all pass WCAG AAA standards.

‍

Color in typography

The following examples show typography color combinations that are better for readability and accessibility.
‍

‍

And here are some color pairings to avoid in typography.
‍

Do not use more than two secondary colors in typography.

‍

Do not use colors that don’t adhere to accessibility standards.

‍

Do not use our secondary colors for background and typography.