Verificador de contraste de cor

Como fazer

1. 1
   Preencha os campos

   Digite seus números ou escolha as opções que precisar.

2. 2
   Veja o resultado

   A resposta se atualiza na hora quando você muda um valor.

3. 3
   Use

   Copie o resultado ou anote. Nada é enviado a lugar nenhum.

Sobre esta ferramenta

Enter a text colour and a background colour as hex codes. You see the contrast ratio and whether it passes the WCAG 2 levels: AA needs 4.5 to 1 for normal text and 3 to 1 for large text, AAA needs 7 to 1 and 4.5 to 1. Good contrast helps everyone, especially people with low vision.

When to use it

Check text and background colours against WCAG contrast rules.

Tips

Aim for 4.5:1 for normal text and 3:1 for large text.

Privacy

Everything runs in your browser, so your data is not uploaded or stored.

Exemplo prático

With the boxes at their starting values (Text colour (hex): #1f2937; Background colour (hex): #ffffff), the tool shows: AA, normal text (4.5 : 1): Pass; AA, large text (3 : 1): Pass; AAA, normal text (7 : 1): Pass; AAA, large text (4.5 : 1): Pass; Interface parts and icons (3 : 1): Pass; Contrast ratio: 14.68 : 1. Change any box to see your own numbers. The result updates as you type, and nothing leaves your browser.

Dicas para melhores resultados

Confira cada campo antes de confiar em um resultado, porque um dígito errado muda a resposta inteira. Use os valores exatos do seu holerite, conta, certificado ou contrato e anote a data em que calculou. Alíquotas, limites e regras mudam de tempos em tempos, então em impostos, taxas e assuntos legais trate o resultado como estimativa e confirme com a fonte oficial indicada nesta página. Você pode testar quantos cenários quiser; nada é guardado nem enviado, e atualizar a página limpa os campos.