Verificador de Contraste de Cores
Um rápido raposa marrom pula sobre o cão preguiçoso
Um rápido raposa marrom pula sobre o cão preguiçoso
O que é Verificador de Contraste de Cores
Esta ferramenta mede a taxa de contraste entre uma cor de texto e uma cor de fundo, e verifica o resultado contra as diretrizes de acessibilidade WCAG 2.1. Ela mostra uma prévia ao vivo das duas cores juntas e informa se o par passa em AA ou AAA para texto normal e texto grande, ajudando a identificar problemas de legibilidade antes que cheguem à produção.
Como usar
- Escolha ou digite a cor do texto no primeiro campo, como um código HEX.
- Escolha ou digite a cor de fundo no segundo campo.
- Confira a taxa de contraste e os selos de aprovado/reprovado para AA e AAA.
- Clique no botão de trocar para testar as cores invertidas.
- Copie a URL para compartilhar o par exato com sua equipe.
Quando usar
Está escolhendo a cor do texto de um novo layout e não tem certeza se está legível o suficiente? Digite a cor do texto e do fundo, por exemplo #767676 sobre #FFFFFF, e você recebe uma taxa de 4.54:1: aprovado em AA para texto normal, reprovado em AAA. É essa a distância entre um produto acessível e um apontamento de auditoria, seja ao revisar o site de um cliente ou publicar seu próprio app.
Perguntas frequentes
Qual é uma boa taxa de contraste para texto?
O WCAG AA exige pelo menos 4.5:1 para texto normal e 3:1 para texto grande (18pt ou 14pt em negrito ou maior). O WCAG AAA é mais rigoroso: 7:1 para texto normal e 4.5:1 para texto grande.
Qual é a taxa de contraste máxima possível?
21:1, a razão entre preto puro (#000000) e branco puro (#FFFFFF). Nenhum par de cores ultrapassa esse valor.
Por que minhas cores reprovaram em AA mas o design ainda parece bom para mim?
Taxa de contraste mede acessibilidade, não gosto pessoal. Uma pessoa com baixa visão, ou alguém vendo a tela sob luz forte, precisa de mais contraste do que um par que parece aceitável para uma visão típica.
Essa ferramenta também verifica daltonismo?
Não. A ferramenta verifica o contraste de luminância segundo a fórmula do WCAG, o que beneficia todos os usuários, incluindo muitas formas de daltonismo, mas não simula deficiências específicas de visão de cor.
Posso compartilhar esta ferramenta com meus dados preenchidos?
Sim. A URL é atualizada automaticamente enquanto você escolhe as cores. Copie da barra de endereço ou use o botão Compartilhar, quem abrir verá suas cores exatas já preenchidas.
Ferramentas relacionadas
Calculadora de Proporção
Calcule a proporção, encontre a largura ou altura que falta e redimensione imagens e vídeos mantendo as mesmas proporções. Grátis.
Decodificador Base64
Decodifique strings Base64 para texto simples instantaneamente. Suporta saída Unicode completa com emojis. Decodificador Base64 gratuito.
Codificador Base64
Converta texto em Base64 instantaneamente no navegador. Suporta Unicode, emojis e caracteres especiais. Codificador Base64 gratuito.