Color Contrast Checker
Check the WCAG contrast ratio between two hex colors and see whether the pair passes AA and AAA accessibility standards.
How to use this tool
- Enter the foreground (text) color and the background color as hex codes.
- The tool computes the WCAG relative luminance of each color.
- Read the contrast ratio and Pass/Fail results for AA and AAA thresholds.
Check whether two colors meet WCAG 2.1 contrast requirements. Minimum ratio is 4.5:1 for normal text (AA) and 7:1 for the highest AAA standard.
Frequently asked questions
- What is WCAG contrast ratio?
- WCAG (Web Content Accessibility Guidelines) defines a contrast ratio formula. It ranges from 1:1 (no contrast) to 21:1 (black on white). Normal body text requires at least 4.5:1 for AA compliance.
- What counts as large text?
- Large text is 18pt (24px) or larger, or 14pt bold (roughly 19px bold). Large text only needs a 3:1 ratio for AA.