Verificador de Contraste de Cor
Cor
Escolha uma cor de frente e uma de fundo para ver a razão de contraste WCAG exata, com aprovado/reprovado instantâneo para AA e AAA em texto normal e grande. Uma pré-visualização ao vivo mostra como a combinação realmente fica. Funciona inteiramente no seu navegador.
Um pequeno jabuti xereta viu dez cegonhas felizes
Um pequeno jabuti xereta viu dez cegonhas felizes
Como usar
- Escolha uma cor de frente (texto).
- Escolha uma cor de fundo.
- Leia a razão de contraste e os resultados AA/AAA.
- Confira a pré-visualização para a legibilidade.
Perguntas frequentes
- Quais razões AA e AAA exigem?
- AA precisa de 4.5:1 para texto normal e 3:1 para texto grande; AAA precisa de 7:1 e 4.5:1 respectivamente.
- O que conta como texto grande?
- Aproximadamente 18pt (24px), ou 14pt (18.66px) em negrito, e maiores.
- Como a razão é calculada?
- A partir da luminância relativa de cada cor usando a fórmula oficial do WCAG 2.
- Suporta alfa?
- Não, compara cores sólidas. Achate qualquer transparência sobre o fundo real primeiro.
Ferramentas relacionadas
Paleta de Cor a partir de Imagem
Solte uma imagem e a ferramenta extrai uma paleta de cores dominantes via Canvas — copie HEX ou pegue o conjunto inteiro.
Simulador de Daltonismo
Veja como sua imagem se parece para pessoas com cada um dos 8 tipos de deficiência visual cromática (CVD).
Gerador de CSS Box Shadow
Desenhe box-shadow CSS visualmente em várias camadas, com pré-visualização ao vivo e saída CSS / Tailwind pronta para copiar.
Conversor de Formatos de Cor
Converta qualquer cor entre HEX, RGB, HSL, HSV, OKLCH e uma variável CSS.
Gerador de Gradientes CSS
Crie gradientes CSS lineares ou radiais com várias paradas de cor e copie o código.
Gerador de Paleta de Cores
Crie paletas harmoniosas a partir de uma cor base em seis esquemas.