WCAG Contrast Checker

Below 12px — may be illegible in practice even if contrast passes.

The rationale

• Low contrast is one of the most common accessibility failures — it affects users with low vision, color blindness, and anyone reading in bright light or on a low-quality screen.
• WCAG contrast requirements exist so that text remains distinguishable from its background without relying on color alone.
• The spec uses a relative luminance formula (not just visual darkness) to calculate perceived contrast between two colors.
• Contrast ratios range from 1:1 (no difference) to 21:1 (black on white). Most real-world UI lives in the 3–8 range.
• Bold and large text get lower thresholds because size and weight improve legibility even at lower contrast.

Key thresholds

• 3:1 — minimum for large text (18pt / 14pt bold) at WCAG AA
• 4.5:1 — minimum for normal text at WCAG AA
• 4.5:1 — minimum for large text at WCAG AAA
• 7:1 — minimum for normal text at WCAG AAA
• Large text = 18pt (24px) normal weight, or 14pt (~18.67px) bold and above
• WCAG has no minimum font size — below 12px is widely considered illegible regardless of contrast ratio

Further reading

• WCAG 2.1 — Success Criterion 1.4.3 Contrast (Minimum)
• WCAG 2.1 — Success Criterion 1.4.6 Contrast (Enhanced)
• Understanding relative luminance — W3C
• WebAIM Contrast Checker
• Accessible color systems — Stripe