Insufficient color contrast

What this means

Text on the page does not have enough contrast against its background color. This makes the text difficult or impossible to read for people with low vision, color blindness, or anyone viewing the screen in bright sunlight.

WCAG requirement

Success Criterion 1.4.3 — Contrast (Minimum): the visual presentation of text and images of text must have a contrast ratio of at least:

• 4.5:1 for normal text (below 18pt or 14pt bold)
• 3:1 for large text (18pt and above, or 14pt bold and above)

Why this matters

• Approximately 300 million people worldwide have color vision deficiency
• Low contrast affects everyone in suboptimal viewing conditions (bright environments, low-quality screens, aging eyes)
• Under the European Accessibility Act, e-commerce websites must meet WCAG 2.1 AA, which includes this criterion

How to fix

1. Check contrast ratios: use tools like the WebAIM Contrast Checker to verify your color combinations
2. Adjust text or background colors: increase the difference between foreground and background
3. Avoid light gray on white: this is the single most common offender (#767676 on #FFFFFF is the minimum for 4.5:1)
4. Test with your actual content: placeholder text may have different contrast than real content