1.4.3: Contrast (Minimum)

What it means

Text and its background need enough contrast so people with low vision (and many others) can read it. WCAG sets minimum contrast ratios for normal and large text.

Normal text needs at least 4.5:1 against its background; large text needs at least 3:1.

How to fix it

  • Check text colour against its background with a contrast checker.
  • Aim for at least 4.5:1 for normal text and 3:1 for large text (as defined by WCAG).
  • Do not rely on light grey text on white, or white text on pale colours, unless the ratio passes.
  • Check hover and focus states as well as the default look.

Quick examples

  • Good: Dark navy text (#1a1a2e) on white meets the minimum ratio for body copy.
  • Bad: Light grey (#b0b0b0) body text on white fails for many readers.
  • Good: A yellow warning banner uses dark text so the words stay readable.
  • Bad: Pale yellow text on a white page is hard to see even for people with typical vision.

W3C Understanding 1.4.3: Contrast (Minimum) — full official details