design
Gratuito
Sem cadastro
Verificador de Contraste de Cores
Verifique as taxas de contraste WCAG 2.1 para pares de cores de primeiro plano/fundo e obtenha resultados de aprovação/reprovação instantaneamente.
Carregando ferramenta…
Sobre esta ferramenta
Insira uma cor de primeiro plano e uma de fundo usando seletores de cores hexadecimais ou campos de texto. A ferramenta calcula a taxa de contraste WCAG 2.1 e mostra crachás de aprovação/reprovação para todos os quatro limites: AA Texto normal (4,5:1), AA Texto grande (3:1), AAA Texto normal (7:1) e AAA Texto grande (4,5:1). Uma visualização ao vivo renderiza texto de amostra em tamanhos normal e grande com as cores escolhidas. A luminância relativa de cada cor também é exibida. Se as cores atuais falham no AA, a ferramenta sugere cores ajustadas (escurecidas ou clareadas) que atendem ao padrão.
Como usar
- 1 Escolha uma cor de primeiro plano usando o seletor de cores ou digite um valor hexadecimal.
- 2 Escolha uma cor de fundo da mesma forma.
- 3 Leia a taxa de contraste e verifique quais níveis WCAG passam ou falham.
- 4 Veja a visualização de texto ao vivo e use as cores sugeridas se necessário para alcançar a conformidade AA.