Color Contrast Checker (WCAG)

Graphics, Photo & Design
16 calculations
Having trouble? Go to tutorial
📝 How it works:
Calculate the color contrast of two colors per WCAG: contrast ratio and AA/AAA rating for accessible web design.

Fill in the fields below and click "Calculate".
Hex, e.g. #333333
Hex, e.g. #FFFFFF

The contrast ratio ranges from 1:1 (no contrast) to 21:1 (black on white) and is calculated from the relative luminance of both colors. WCAG 2.1 requires at least 4.5:1 (AA) or 7:1 (AAA) for accessible text. The checker tests the foreground and background color and shows which levels are met.

Advertisement