Free Tool

Color Contrast Checker

Check text and background contrast against WCAG AA & AAA — make your UI accessible to everyone.

🔒 100% Private ♿ WCAG 2.1 ⚡ Live Preview 🧮 Exact Ratio
Colors
The quick brown fox
Accessible color contrast makes your content readable for everyone, including people with low vision or color blindness. This is sample body text at a normal reading size.
Small print and captions need the strongest contrast of all — this is 13px sample text.
Sample Button
21.00 : 1
Contrast Ratio
✓ Excellent
AA · Normal text
Requires ≥ 4.5 : 1
✓ Pass
AA · Large text
Requires ≥ 3 : 1
✓ Pass
AAA · Normal text
Requires ≥ 7 : 1
✓ Pass
AAA · Large text
Requires ≥ 4.5 : 1
✓ Pass
♿
WCAG 2.1 Accurate
Uses the official relative luminance formula with sRGB linearization, exactly as defined in the WCAG 2.1 spec.
📐
Large vs Normal Text
Large text (≥ 24px, or 18.66px bold) only needs 3:1 for AA. Normal body text needs 4.5:1. We check both.
🔒
100% In Your Browser
No uploads, no servers, no tracking. Every calculation runs locally and instantly as you tweak colors.