Skip to content

Color contrast

Applies to

  • Websites
  • Documents
  • Online courses

Overview

Some users have difficulty perceiving text if there is too little contrast between foreground and background. The W3C Web Content Accessibility Guidelines (WCAG) 2.1 define specific contrast ratios that must be met in order comply at particular levels:

  • Level AA: 4.5:1
  • Level AA (large text): 3:1
  • Level AAA: 7:1
  • Level AAA (large text): 4.5:1

The contrast requirements for large text (18-point or 14-point bold) are less stringent than those for regular-sized text, and the contrast requirements for Level AA are less stringent than those for Level AAA.  At the University of Washington, our goal is to meet the Level AA requirements.

Techniques

When designing the color scheme of a website, web page, or document, be sure to consider whether there is sufficient contrast between foreground text and background.

Several free tools have been developed that make it easy to check color combinations for WCAG  compliance. For examples, see the following pages:

WCAG 2.1 success criteria

The issues described on this page, and associated Techniques pages, map to the following success criteria in the W3C’s Web Content Accessibility Guidelines (WCAG) 2.1: