Reports the contrast ratio and whether it passes WCAG AA and AAA for normal and large text, plus the 3:1 threshold for UI components. The maths includes the sRGB gamma expansion, which is why a mid-grey can look acceptable and still fail.
Runs entirely in your browser
Readable text needs enough contrast between the foreground and background, and the Web Content Accessibility Guidelines (WCAG) define exactly how much. This checker takes a text colour and a background colour and reports the contrast ratio, then tells you whether it passes WCAG AA and AAA for normal and large text, plus the 3:1 threshold that applies to user-interface components and graphics.
The calculation follows the WCAG method precisely, including the sRGB gamma expansion applied to each channel before computing relative luminance. That step is why intuition misleads: a mid-grey that looks fine can still fail, because perceived brightness is not linear. Relying on the real formula rather than the eye is the point of the tool.
It runs in your browser, so you can check colours instantly and privately. Use it while designing to ensure text meets the level you are targeting — AA is the common legal and practical baseline — and to check UI elements like icons and form borders against the 3:1 rule.
TechToolsHQ is an independent, reader-supported tech platform. If this free tool saved you time, solved a problem, or helped your workflow, consider supporting our work. Your support helps us keep our utilities 100% free, private, and ad-free for everyone.