The Dictionary of
Color Combinations

Tools / Contrast Checker

WCAG Contrast Checker.

Pick two colors, get the contrast ratio and WCAG AA/AAA grades instantly. Grounded in the same color library that powers the 378 Wada combinations.

Normal text (16px)

The quick brown fox jumps over the lazy dog.

Large text (24px bold) — threshold ÷ by 1.5

Wada, 1933 — shikisai no jiten.

UI component (button)

— contrast ratio
— AA — Normal text ≥ 4.5 : 1
— AA — Large text ≥ 3 : 1
— AAA — Normal text ≥ 7 : 1
— AAA — Large text ≥ 4.5 : 1

Try a Wada classic

How WCAG contrast works

The formula

WCAG 2.1 defines contrast as the ratio of the relative luminances of two colors, where luminance accounts for how the human eye perceives brightness differently in red, green, and blue channels (0.2126R + 0.7152G + 0.0722B, after gamma correction). The result ranges from 1:1 (identical) to 21:1 (black on white).

The grades

AA is the minimum required by most legal accessibility standards (WCAG 2.1 level AA). Normal text needs 4.5:1; large text (18px+ or 14px+ bold) and UI components need 3:1.

AAA is enhanced — 7:1 for normal text, 4.5:1 for large text. It is not required by law in most jurisdictions but significantly improves readability for users with low vision.