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 Gratuito Sem cadastro

Color Accessibility Checker

Check WCAG contrast ratio for foreground and background colors.

Carregando ferramenta…

Sobre esta ferramenta

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.

Como usar

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.

Perguntas frequentes

Ferramentas relacionadas

Color Palette from Image

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

Conversor de cores (HEX, RGB, HSL)

Converta cores entre HEX, RGB, HSL, HSV e CMYK — com prévia em tempo real.