Enter two hex colors to check the contrast ratio and WCAG AA/AAA accessibility rating.
Text needs enough contrast against its background to be readable, especially for users with low vision. This tool calculates the exact contrast ratio between two colors using the WCAG formula and tells you if the combination passes AA (4.5:1) or AAA (7:1) standards.
Step 1 — Set your text color using the color picker or by typing a hex code.
Step 2 — Set your background color the same way.
Step 3 — Check the results. The live preview shows exactly how the combination looks.
Only checking large text against the AA large-text threshold. Large text (18pt+) only needs 3:1, but regular body text needs 4.5:1 — make sure you're checking against the right size category.
Using low-contrast brand colors for body text. Reserve brand colors that fail contrast checks for large headlines or decorative elements, not paragraph text.
WCAG AA requires 4.5:1 for normal text and 3:1 for large text (18pt+ or 14pt+ bold). AAA requires 7:1 and 4.5:1 respectively.
Yes — good contrast helps thumbnail text stand out and stay readable at small sizes, which is directly linked to click-through rate.