WCAG Contrast Checker - AA & AAA
Check foreground/background color contrast ratios against WCAG 2.1 AA and AAA standards. Instant results in your browser.
How to use
- 1
Pick your foreground color
Enter a HEX value or use the color picker for the text color.
- 2
Pick your background color
Enter the background color the text will appear on.
- 3
Check the WCAG result
The contrast ratio and pass/fail results for AA and AAA levels are shown instantly.
Why use this tool?
- Checks WCAG 2.1 AA and AAA compliance for normal and large text
- Live text preview shows exactly how the colors look together
- Contrast ratio calculated entirely in your browser
- Supports both hex input and native color picker
Frequently asked questions
- What contrast ratio is required for WCAG AA?
- WCAG AA requires a 4.5:1 ratio for normal text and 3:1 for large text (18pt regular or 14pt bold).
- What is WCAG AAA?
- WCAG AAA is the enhanced level: 7:1 for normal text and 4.5:1 for large text. It is recommended for maximum accessibility.
- Why does contrast matter?
- Low contrast makes text hard to read for people with low vision or color blindness. WCAG guidelines ensure content is accessible to the widest possible audience.
Related tools
Convert color codes between HEX, RGB, HSL, and HSV instantly. Pick any color and see all formats update live - no server, no upload.
Convert any image to a Base64 data URI instantly in your browser. Embed images in HTML or CSS. No upload required.
Popular right now
Format, validate, and minify JSON instantly in your browser. Your data never leaves your device.
Decode JWT tokens and inspect header and payload instantly in your browser. Your tokens never leave your device.
Count words, characters, sentences, and estimate reading time instantly in your browser. No sign-up required.