FFCheckPrivacyCheck
♿ Accessibility

Colour contrast requirements WCAG 1.4.3

WCAG 1.4.3 AA: text min. 4.5:1, large text 3:1, UI elements 3:1. Tools, exceptions, and why this helps sighted users too.

Last reviewed: 25 May 2026
Colour contrast is one of the most-violated + easiest-to-fix WCAG requirements. WCAG 1.4.3 (AA): normal text min. 4.5:1 ratio with background, large text (18pt+ or 14pt-bold+) min. 3:1. WCAG 1.4.11 (AA): UI components (button borders, focus indicator, form borders, icon graphic) min. 3:1 with adjacent area. Exceptions: decorative text (logo), inactive buttons, text in images that are illustrative only. Level AAA (further): 7:1 text + 4.5:1 large text. Not legally required but better for low-vision + older users. Common mistakes: grey text on white background (#999 = 2.85:1, not AA), brown on olive green, blue link on dark-green background, white text on pastel shades. Who benefits? Not just blind users — also: elderly, low-vision, colour-blind (8% of men), mobile users in sunlight, badly-calibrated monitors. Practical tools: WebAIM Contrast Checker (free, fast), Stark plugin for Figma + Adobe, axe DevTools, Lighthouse report. For brands: pick one high-contrast primary colour + use it for CTAs. Quick fix: dark text (#222) on white background + high-contrast accent colour is a safe standard. Avoid subtle greys for body text.

Sources

🔎 Common search variants

Recognise your own search? Our answer above covers these too.

  • colour contrast wcag
  • contrast ratio 4.5:1
  • colour blind website