Contrast ratio color grid

Quickly compare every colour in your palette against each other to see which combinations meet the Web Content Accessibility Guidelines (WCAG) minimum contrast ratios. For example.

One color per line.

Scoring guide

AAA ≥7.00
Sufficient contrast for any text at WCAG Level AAA.
AA ≥4.50
Sufficient contrast for any text at WCAG Level AA, and large text at Level AAA.
AAL ≥3.00
Sufficient contrast for UI elements and large text at WCAG Level AA.
Fail <3.00
Doesn't meet minimum contrast. Only suitable for disabled UI elements and presentational (non-content) elements.
#FFFFFF
#F5F5F5
#0FF10F
#0BC148
#252134
#302750
#7C56FC
#FFFFFF
Fail 1.09
Fail 1.54
Fail 2.40
AAA 15.60
AAA 13.71
AA 4.57
#F5F5F5
Fail 1.09
Fail 1.42
Fail 2.20
AAA 14.31
AAA 12.58
AAL 4.19
#0FF10F
Fail 1.54
Fail 1.42
Fail 1.56
AAA 10.11
AAA 8.88
Fail 2.96
#0BC148
Fail 2.40
Fail 2.20
Fail 1.56
AA 6.49
AA 5.70
Fail 1.90
#252134
AAA 15.60
AAA 14.31
AAA 10.11
AA 6.49
Fail 1.14
AAL 3.41
#302750
AAA 13.71
AAA 12.58
AAA 8.88
AA 5.70
Fail 1.14
Fail 3.00
#7C56FC
AA 4.57
AAL 4.19
Fail 2.96
Fail 1.90
AAL 3.41
Fail 3.00