◐

Verificador de Contraste de Cores

Verifique a razão de contraste WCAG entre uma cor de texto e de fundo com resultados AA/AAA.

Seus arquivos ficam neste dispositivo

Os arquivos são processados no navegador, nunca enviados. O site baixa o código e os recursos necessários. Sem contas ou rastreadores.

Use Baixar para salvar esta ferramenta em um único arquivo HTML para uso offline.

Privacidade →

Cor do texto

Fundo

Um pequeno jabuti xereta viu dez cegonhas felizes.

Texto de amostra grande

Experimente um exemplo resolvido

Exemplo

Defina a cor do texto como #767676 e o fundo como #ffffff. A razão é 4.54:1, que passa no AA para texto normal. Um tom mais claro, #777777, dá 4.48:1 e falha, porque o AA exige pelo menos 4,5:1 para texto normal.

Lembre-se

Texto grande (cerca de 24px, ou 18,7px em negrito) precisa de apenas 3:1 no AA. A razão ignora fontes finas, texto sobre imagens e transparência, então confira também o design real e não use só a cor para transmitir significado.

Sobre esta ferramenta

Compare uma cor de primeiro plano e de fundo para ver a razão de contraste WCAG e se ela passa em AA e AAA, tudo calculado localmente no seu navegador.

Perguntas frequentes

O que conta como texto grande?

A WCAG considera texto de 18pt (24px) ou 14pt (18,66px) em negrito como grande, o que exige uma razão menor de 3:1 para AA.

Quais razões passam?

Texto normal precisa de 4,5:1 para AA e 7:1 para AAA; texto grande precisa de 3:1 para AA e 4,5:1 para AAA.