Contrast Badge Checker
Pick text and background colors to see the WCAG contrast ratio and passes.
Check contrast against WCAG
Readable text needs enough contrast against its background, and the WCAG guidelines set the thresholds accessibility law relies on. This checker measures the ratio for a text and background pair and shows which levels it passes.
Pick two colors and it computes the contrast ratio from their relative luminance and flags AA and AAA for both normal and large text. A live preview shows the actual pairing so you can judge readability too.
Standards-based and private
It uses the official luminance formula in your browser, so the check is accurate and nothing you pick is uploaded.
Frequently Asked Questions
What ratios must I hit?
WCAG AA needs 4.5:1 for normal text and 3:1 for large text; AAA needs 7:1 and 4.5:1. The tool shows which levels your pair clears.
How is contrast measured?
From the relative luminance of each color; the ratio ranges from 1:1 (identical) to 21:1 (black on white).
Why does it matter?
Low contrast is unreadable for many users and fails accessibility law that references WCAG, so meeting AA is the practical baseline.
Browse the full set of free, private, in-browser tools.