What contrast ratio is required to pass WCAG AA?

WCAG AA requires a contrast ratio of at least 4.5:1 for normal text and 3:1 for large text (18pt or 14pt bold).

AAA is the highest conformance level, requiring 7:1 for normal text and 4.5:1 for large text. It is harder to achieve but recommended for critical content.

How are suggested accessible colors generated?

When a pair fails, the tool progressively darkens or lightens the foreground color in small steps until it finds the nearest shade that meets the AA threshold.

What counts as large text?

WCAG defines large text as 18pt (24px) or larger, or 14pt (approximately 18.67px) bold or larger.

Design Free No signup

Color Accessibility Checker

Check WCAG contrast ratio for foreground and background colors.

Loading tool…

About this tool

Enter any foreground and background color using the hex color pickers and instantly see the WCAG 2.1 contrast ratio along with AA and AAA pass/fail results for both normal text and large text. Four live text-size previews show exactly how your color pair looks at different scales. If the combination fails, the tool suggests nearby accessible colors that do pass, so you can quickly find a compliant alternative without leaving the page.

How to use

1 Pick a foreground (text) color using the color picker or type a hex code.
2 Pick a background color the same way.
3 View the contrast ratio and WCAG AA/AAA results for normal and large text.
4 If failing, click a suggested color to apply it and meet the AA standard.

Frequently Asked Questions

Related tools

Color Palette from Image

Extract dominant colors from any image using k-means clustering with CSS, Tailwind, Figma, and ASE export.

Color Converter (HEX, RGB, HSL)

Convert colors between HEX, RGB, HSL, HSV, and CMYK — with live preview.