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 #025997

navy-800 #012a48

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 #c5fcd8

green-600 #078854

green-800 #055c3c

Red

Urgency, Error

red-100 #fceaea

red-200 #f9d9d8

red-600 #e44e4a

red-800 #b31e1a

Yellow

Warning, Alert

yellow-200 #fef5e1

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.