What Is WCAG Color Contrast?
The Web Content Accessibility Guidelines (WCAG) define minimum contrast ratios between text and background to ensure readability. Level AA requires 4.5:1 for normal text and 3:1 for large text (18pt or bold 14pt). Level AAA is stricter: 7:1 and 4.5:1 respectively.
Low contrast affects users with low vision, color blindness, or those viewing screens in bright sunlight. Compliance with WCAG AA is required by accessibility laws in many countries, including the ADA in the US and EN 301 549 in the EU.
Color Blindness Design Principles
Never rely on color alone to convey information. Red-green color blindness (protanopia/deuteranopia) affects roughly 8% of males. Always pair color with icons, labels, or patterns. Avoid red-green combinations as the sole differentiator.
Frequently Asked Questions
AA requires 4.5:1 for normal text, 3:1 for large text. AAA is stricter: 7:1 for normal text, 4.5:1 for large text.
Users with low vision, color blindness, or bright-light conditions struggle to read the text. It may also mean non-compliance with accessibility laws.
#767676 achieves ~4.54:1 against white, just passing AA. Any lighter shade fails AA for normal-size text.