Analizador de contraste de cores

Um analisador de contraste de cores rápido, baseado em normas, para designers e desenvolvedores verificarem legibilidade do texto contra cores de fundo em maquetes UI.

Request Feature / Support
5,964+
Total Calculations Run
< 15ms
Browser Execution Speed
100%
Client-Side Privacy
4.9 / 5.0
User Satisfaction
AI Web Tool Generator

Build Your Own Custom Web Calculator in Seconds

Type what tool or calculator you need below. Our AI will build it instantly for your site.

Popular ideas:
100% FREE • No Credit Card Required

About This Tool

Esta ferramenta calcula relações de contraste WCAG conformes para pares de cores de primeiro plano e fundo. Considera contextos de tamanho de texto para indicar Pass/Fail para texto normal e grande, e relata uma razão numérica com um veredito de acessibilidade.
Especificamente, aceita cor de primeiro plano, cor de fundo e tamanho da fonte em px, converte as cores para luminância sRGB e aplica a fórmula de proporção padrão. Os limiares seguem WCAG: 4,5:1 para texto normal AA, 7:1 para texto normal AAA; 3:1 para grande AA e 4,5:1 para grande AAA. Funções opcionais incluem manejo de alfa, simulações de daltonismo e recomendações de cores no modo avançado.
O público-alvo são designers, engenheiros frontend, profissionais de acessibilidade e equipes de produto que buscam resultados rápidos, precisos e em conformidade com os padrões. O valor único reside na avaliação por tamanho de texto com status Pass/Fail claro e saídas exportáveis para remediação e governança.

How to Use

  1. Forneça cores de primeiro plano e fundo e o tamanho da fonte em px.
  2. Execute o cálculo para obter a relação de contraste e o status de conformidade para texto normal e grande.
  3. Revise os resultados; ajuste cores ou tamanho da fonte, se necessário.
  4. Utilize cores alternativas recomendadas para atingir rapidamente os objetivos AA/AAA.
  5. Exporte ou copie o resultado para documentação.
How to use online color contrast analyzer

Frequently Asked Questions

Find Quick Answers

O que é a relação de contraste de cores?
A relação é uma métrica WCAG baseada na luminância relativa entre o texto e o fundo. É expressa como x:1 com x ≥ 1; valores mais altos indicam melhor legibilidade. A ferramenta reporta a razão numérica e o veredicto por tamanho de texto.
Como são aplicadas as thresholds?
Para texto normal, WCAG AA exige pelo menos 4,5:1 e AAA 7:1. Para texto grande, 3:1 AA e 4,5:1 AAA. A ferramenta aplica estas thresholds para determinar Pass ou Fail para cada contexto de texto.
Como é tratada a transparência?
Se uma cor contém alfa, ela é composta por padrão sobre branco antes de calcular a luminância. Isso gera uma cor efetiva. No modo avançado, o tratamento pode ser ajustado ou as entradas brutas podem ser exibidas para análise especializada.
Quais formatos de entrada são suportados?
A ferramenta aceita hex (#RRGGBB ou #RGB), rgb()/rgba() e nomes de cores CSS. Se uma entrada não puder ser analisada, o resultado mostrará um código de erro em vez de uma mensagem UI.

Need to run multiple calculations?

Create a free account today to unlock unlimited daily runs, access advanced parameters, save your history, and request custom features.

Register Free Account

Related Tools

Other useful calculators and utilities you might like

Color & Design Tools

Conversor Spotify para MP3

Converte arquivos de áudio fornecidos localmente para MP3, permitindo ouvir offline e compatibilidad...

Color & Design Tools

Calculadora de Distância Rodoviária

Calculadora de distância rodoviária para viajantes, planejadores logísticos e motoristas, para estim...

Color & Design Tools

Calculadora de Idade

Determine rapidamente a idade de uma pessoa a partir da sua data de nascimento com nossa calculadora...

Color & Design Tools

Conversor de moedas

Converta rapidamente valores entre diferentes moedas com nosso conversor de moedas online gratuito,...

Your Feedback Matters

Help Us to Improve