illustration of a large eye with multi-colored sliders

Easy to Read Text

Text that is offset poorly by its background can be difficult for people with poor vision to read. This can also apply to icons or images on a page.

  • Use sufficient contrast. Make sure that the contrast ratio between text color and background color is at least 4.5:1. There are color contrast tools that can help you test color pairs for contrast and adjust the values as necessary.
  • Avoid very high contrast. Be aware also that for some people, especially people with dyslexia, a very high contrast color scheme can make reading more difficult. It is a good idea to choose an off-white background color rather than a white background to aid on-screen reading.

Examples

The following example shows two color combinations: one that has a low contrast ratio and one that has a high contrast ratio.

examples of color contrast in page copy

Color contrast checking tools can compare two color values and report on the contrast ratio between them. Some tools will allow you to adjust these values until the ratio is sufficient, helping you to choose a color scheme that avoids contrast problems.

color-contrast checking tool screenshot

Accessibility Checklist

Check text and background color combinations on the page, using a color contrast checking tool:

  • Does the contrast ratio exceed 4.5:1 (or 3:1 for large text)?

Resources