Ferramenta de Contraste de Cores

Ajuda designers e desenvolvedores a verificar o contraste WCAG entre foreground e background para acessibilidade da web.

Request Feature / Support
8,488+
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 a relação de contraste entre duas cores de entrada usando as fórmulas WCAG. Aceita cores de foreground e background em formatos hex ou rgb e retorna uma relação numérica de contraste, bem como aplicabilidade AA e AAA.
Conceitualmente, o fluxo analisa as entradas, as converte para sRGB, calcula a luminância relativa de cada cor e, em seguida, aplica a fórmula de contraste WCAG. O cálculo utiliza L = 0,2126R + 0,7152G + 0,0722B após linearização dos valores sRGB e Constraste = (L1 + 0,05) / (L2 + 0,05) com L1 ≥ L2.
Quem se beneficia: engenheiros frontend, designers UI/UX, equipes de QA e equipes de produto que realizam auditorias de acessibilidade. Casos de uso incluem texto sobre imagens, botões contra fundos variados, tematização e paletas responsivas em modos claro e escuro.
Valor único: suporta vários formatos de entrada, fornece resultados numéricos precisos e indica claramente conformidade para texto padrão e de tamanho grande. Funcionalidades opcionais incluem orientação automatizada para ajustar pares de cores, resultados prontos para exportação para handoffs de design e saídas legíveis por máquina para pipelines de automação.

How to Use

  1. Fornecer insumos: cor de foreground e cor de background em hex ou rgb.
  2. Opcionalmente definir o tamanho do texto em px para texto normal vs grande.
  3. Escolher o modo de acessibilidade (AA ou AAA).
  4. Executar o cálculo e observar os resultados.
  5. Ajustar as cores para atingir os limiares desejados e testar novamente.
How to use color tool windows

Frequently Asked Questions

Find Quick Answers

Quais formatos de cor são suportados?
A ferramenta aceita cores hex (#RRGGBB ou #RGB) e valores rgb(a). Normaliza as entradas para o espaço de cores sRGB para o cálculo. Cores nomeadas não são garantidas em todos os ambientes.
Como é calculado o relatório de contraste?
As entradas são analisadas e convertidas em valores sRGB lineares. A luminância relativa L é calculada como L = 0,2126R + 0,7152G + 0,0722B. O rácio de contraste é (L1 + 0,05) / (L2 + 0,05) com L1 ≥ L2, seguindo as fórmulas WCAG.
Como interpretar os resultados?
A ferramenta retorna o rácio de contraste e booleanos passes_AA e passes_AAA. Para texto normal, AA exige ≥ 4,5:1 e AAA ≥ 7:1. Para texto grande, AA ≥ 3:1 e AAA ≥ 4,5:1.
Inclui simulações de dispositivo ou espaço de cor?
A ferramenta usa por padrão o sRGB e não simula renderização específica de dispositivos ou diferenças perceptivas entre monitores. Foca no contraste WCAG para conteúdo web.

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