Color Contrast Checker — WCAG AA/AAA

Color

A color contrast checker compares relative luminance of foreground and background colors to calculate WCAG contrast ratio and pass/fail results.

What is it

In web accessibility, color contrast affects text readability. WCAG recommends 4.5:1 for normal text AA, 3:1 for large text AA, and 7:1 for AAA.

contrast ratio = (Lighter + 0.05) / (Darker + 0.05)

How to use

  1. 1Enter the foreground HEX color.
  2. 2Enter the background HEX color.
  3. 3Check the contrast ratio and AA/AAA results.

Reference

Color Contrast Checker — WCAG AA/AAA Reference
ForegroundBackgroundRatioResult
#111111#FFFFFF18.88:1AAA
#777777#FFFFFF4.48:1Normal text AA fails

Sources & standards

FAQ

What is the WCAG AA text contrast requirement?

Normal text needs at least 4.5:1, and large text needs at least 3:1 for WCAG AA.

Is color contrast input sent to a server?

No. This tool runs in your browser and does not send input to a server.

Related tools