What is WCAG AA vs AAA?

WCAG AA is the standard legal requirement in most jurisdictions (4.5:1 for normal text, 3:1 for large text ≥18pt or 14pt bold). WCAG AAA is the enhanced level (7:1 / 4.5:1) for maximum accessibility.

What counts as "large text" in WCAG?

Large text is at least 18pt (24px) for regular weight, or 14pt (approximately 18.67px) for bold text. Large text has a lower contrast requirement because it is easier to read.

How is the contrast ratio calculated?

WCAG uses relative luminance: each color's luminance is calculated from its linearized RGB values, then the ratio is (L1 + 0.05) / (L2 + 0.05) where L1 is the lighter color. White on black is 21:1 (maximum).

WCAG Contrast Checker

Pattern Tools

Check color contrast ratios for WCAG AA and AAA accessibility compliance

100% client-side processing

Foreground (text color)

Background color

Sample text — large (18px+ bold)

Normal body text (14px). The quick brown fox jumps over the lazy dog.

Small text (12px). Hard to read at low contrast.

Contrast Ratio

17.40:1

Level	Normal text	Large text (18px+ / 14px+ bold)	Required ratio
WCAG AA	PASS	PASS	4.5:1 / 3:1
WCAG AAA	PASS	PASS	7:1 / 4.5:1

Quick pairs

How to Use WCAG Contrast Checker Online

Paste your data into the input field above
The result appears instantly in the output area
Click "Copy" to copy the result to your clipboard

Check color contrast ratios for WCAG AA and AAA accessibility compliance. Runs 100% client-side — no data is sent to any server.

Recommended Tools

Vercel

Deploy frontend apps with zero config

Try Free

Netlify

Build and deploy modern web projects

Try Free

DigitalOcean

Cloud infrastructure for developers

Try Free

Railway

Deploy apps, databases, and cron jobs instantly

Try Free

Frequently Asked Questions

Related Tools

Regex Tester

Test regular expressions with live highlighting and capture groups

Cron Builder

Build and explain cron expressions visually

Color Converter

Convert between HEX, RGB, and HSL color formats

Embed this tool on your site →