Home » Color Contrast Guide

Color Contrast Guide


Please change colors only when absolutely necessary (such as when adding multiple buttons). To ensure consistency throughout the site, you’ll want to leave elements (such as headers) with the colors as originally designed.

When applying colors from the site palette, follow the guide below to ensure proper color contrast is met. These color combinations pass WCAG 2.0 AA minimum contrast guidelines. Each color combination below may be used as shown and in reverse (for example, background color on the foreground or foreground color on the background.)

Background (white, #FFFFFF)

Background
Foreground

Background
Primary

Background
Secondary

Background
Tertiary (Large text only)

Background
Linkblue

Background2 (light gray, #DDDCDC)

BackgroundTwo
Foreground

BackgroundTwo
Primary

BackgroundTwo
Secondary

BackgroundTwo
Tertiary (Do NOT USE)

BackgroundTwo
Linkblue

Accent (light orange, #FFEAE1)

Accent
Foreground

Accent
Primary

Accent
Secondary

Accent
Tertiary (DO NOT USE)

Accent
Linkblue