Desenvolvedor🔒 Funciona no seu navegador

Verificador de Contraste de Cores

Verificar conformidade WCAG AA/AAA do contraste de cores

Cor do texto

Cor de fundo

Título de visualização

É assim que o corpo do texto ficará com essas cores.

E este é o texto pequeno para referência.

Proporção de contraste

21.00:1

WCAG AA

Texto normal✓ Aprovado

Texto grande (18px+)✓ Aprovado

Componentes de interface✓ Aprovado

WCAG AAA

Texto normal✓ Aprovado

Texto grande (18px+)✓ Aprovado

Sobre Verificador de Contraste de Cores

O Verificador de Contraste de Cores avalia a proporção de contraste entre duas cores de acordo com as diretrizes WCAG 2.1. Ele informa se suas combinações de cores atendem aos padrões de acessibilidade AA ou AAA para texto normal, texto grande e componentes de interface. Tudo é executado no seu navegador.

Perguntas frequentes

Qual é uma boa proporção de contraste?

WCAG AA exige uma proporção mínima de 4,5:1 para texto normal e 3:1 para texto grande (18px+ ou 14px+ em negrito). WCAG AAA exige 7:1 para texto normal e 4,5:1 para texto grande. Proporções maiores significam melhor legibilidade.

Qual é a diferença entre AA e AAA?

AA é o padrão mínimo recomendado para a maioria do conteúdo web. AAA é um padrão mais rigoroso que oferece melhor legibilidade para usuários com deficiência visual. Atingir AAA é ideal, mas nem sempre obrigatório.

Como a proporção de contraste é calculada?

A proporção de contraste é calculada usando a luminância relativa de cada cor, conforme definido pelo WCAG 2.1. A fórmula compara as cores mais clara e mais escura em uma escala de 1:1 (sem contraste) a 21:1 (contraste máximo, preto sobre branco).

Sobre Verificador de Contraste de Cores

Perguntas frequentes

Qual é uma boa proporção de contraste?

Qual é a diferença entre AA e AAA?

Como a proporção de contraste é calculada?