Color

See Tokens for implementation and usage.

Color Palette

Gray

Text, default states, inactive states, borders

white #FFFFFF

gray-050 #F5F7F7

gray-100 #EFF0F0

gray-200 #EAEAEA

gray-300 #D9D9D9

gray-400 #BFBFBF

gray-500 #848484

gray-600 #595959

gray-800 #1B1B1B

Navy

Brand, Secondary CTA, Text

navy-100 #F1F6FB

navy-200 #DDEEF9

navy-600 #025384

navy-800 #052C48

Teal

Primary CTA, Links, Info

teal-200 #CDECF5

teal-500 #23B1DA

teal-800 #127CA5

teal-900 #006789

Blue Royal

Accent

blue-royal-600 #243CA8

Green

Deals, Price, Success

green-200 #E3F2F0

green-600 #078854

green-800 #006644

Red

Urgency, Error

red-200 #FBDDDF

red-600 #DF2B26

red-800 #B1201B

Yellow

Warning, Alert

yellow-200 #F8F3DB

yellow-600 #F7B01C

Accessibility

Our color palette has been chose to meet or exceed color contrast ratios defined as AA in WCAG 2.1. This means the ratio of text and background colors should be at least 4.5:1, and the ratio of graphic elements and backgrounds should be at least 3.0:1.