Calculadora de Legibilidade Visual WCAG e APCA

Verifique o contraste real de seus designs com APCA (WCAG 3.0). Analise como peso e tamanho da fonte afetam a legibilidade real.

Cores Base
#1E293B
#FFFFFF
Tipografia
16px
400
Comparação de Contraste
Razão WCAG 2.1 21.00 Aprova AAA
APCA Lc (WCAG 3) 100 Excelente
Visualização Perceptual

A legibilidade visual não é apenas matemática. É como luz e sombra interagem com seus olhos.

Recomendações APCA
Texto de Leitura (Corpo)
Texto Pequeno / Legenda
UI / Botões
Estúdio de Utilitários

Quer este utilitário no seu site?

Personalize cores e o modo escuro para WordPress, Notion ou o seu próprio site.

Avançar

Perguntas frequentes

O que é APCA e por que é diferente de WCAG 2.1?

APCA é o Algoritmo Avançado de Contraste Perceptual desenvolvido para WCAG 3.0. Diferentemente da razão simples antiga, APCA usa modelos matemáticos que imitam como o cérebro humano percebe contraste, levando em conta polaridade e peso/tamanho da fonte.

O que significa o valor Lc?

Lc (Contraste de Luminosidade) é o valor de contraste gerado por APCA. Um valor de 100 representa contraste máximo ideal, enquanto valores abaixo de 60 começam a ser críticos para leitura contínua.

Como o peso da fonte afeta a legibilidade?

Fontes Finas/Claras requerem contraste muito mais alto para serem legíveis. APCA penaliza fontes de baixo peso, indicando que um design passando em WCAG com fonte peso-100 pode ser ilegível na prática.

Esta calculadora é privada?

Sim, todos os cálculos são realizados localmente em seu navegador. As cores e configurações que você analisa nunca são enviadas para nenhum servidor, garantindo total privacidade.

# Calculadora de Legibilidade Visual (WCAG vs APCA)

Entenda como suas cores e tipografia afetam a leitura real com o novo padrão de acessibilidade perceptual. WCAG 2.1 usa uma fórmula matemática simples de 2008. APCA é o novo modelo proposto para WCAG 3.0 que imita percepção humana.

# Pontos-Chave de APCA

  • Polaridade: Entende que Modo Escuro é percebido diferentemente do Modo Claro.
  • Peso da Fonte: Atribui níveis de contraste específicos (Lc) baseado em peso tipográfico.
  • Linearidade: Corrige imprecisões matemáticas no modelo de luminância relativa de 2008.

# Níveis APCA Recomendados

  • Lc 90+: Ideal para texto muito pequeno ou peso baixo.
  • Lc 75: Padrão para texto corporal principal.
  • Lc 60: Mínimo para conteúdo médio legível.
  • Lc 45: Mínimo para elementos grandes ou decorativos.

Referências Bibliográficas

Mais utilitários de Desenvolvimento Web

Formatador e Validador de JSON Online Grátis

Ferramenta online gratuita para formatar, validar e reparar código JSON. Embeleze e formate JSON. Detecta erros de sintaxe e melhora a legibilidade do código.

Usar ferramenta

Conversor Gratuito Online de SVG para CSS e Data URI

Transforme seus ícones e vetores SVG em código CSS (Background ou Mask) ou Data URI compactado. Otimize o desempenho do seu site eliminando solicitações HTTP externas.

Usar ferramenta

Calculadora de Proporção (Aspect Ratio) em Pixels. Proporções Online

Calcule novas resoluções de imagem, vídeo e web design mantendo a proporção exata para evitar distorções gráficas. Suporta 16:9, 4:3, 21:9 e formatos personalizados.

Usar ferramenta

Gerador de Imagens Marcador. Mockups Web Rápidos Online

Crie imagens marcador personalizadas para seus designs web. Ajuste a resolução, fundo, texto e exporte em PNG, WebP ou JPEG instantaneamente.

Usar ferramenta

Codificador e Decodificador de URL Online

Converta caracteres especiais de qualquer link para um formato seguro (Percent-Encoding) ou restaure-os instantaneamente para o estado original legível de forma local.

Usar ferramenta

Remover CSS Duplicado Online. Unifique e Limpe as Suas Folhas de Estilo

Ferramenta gratuita para limpar e purgar código CSS duplicado. Unifica seletores redundantes, respeita a cascade e reduz instantaneamente o tamanho dos ficheiros diretamente no browser.

Usar ferramenta

Conversor CSS para HTML Inline. Embutidor para Emails

Transforme suas folhas de estilos e classes CSS em estilos embutidos automaticamente no HTML. Ideal para newsletters, e-mails transacionais e layout web seguro.

Usar ferramenta

Calculadora de Especificidade CSS Online. Visualizador de Peso de Seletores

Calcule a especificidade e o peso exato de qualquer seletor CSS. Ferramenta visual para entender qual regra CSS vence a cascata e evitar o uso de !important.

Usar ferramenta

Gerador de Expressões Cron Online. Tradutor e Visualizador

Ferramenta visual gratuita para gerar expressões Linux Cron. Traduz * * * * * para linguagem humana e mostra as próximas 5 execuções em tempo real.

Usar ferramenta

Visualizador Online de Código de Tecla. Inspetor de Código de Tecla

Ferramenta online gratuita para ver event.key, event.code, event.which e localização de qualquer tecla de teclado em tempo real. Gera snippets de código JavaScript prontos para usar.

Usar ferramenta

Calculadora de Custo LLM. Estimador de Preços de Modelos IA

Ferramenta online gratuita para estimar o custo de chamar APIs LLM. Compare GPT-4o, Claude, Gemini, Llama e mais com preços reais de tokens por milhão.

Usar ferramenta

Escala Tipográfica Musical. Calculadora de Escala Modular

Ferramenta online gratuita para criar hierarquias visuais harmoniosas usando escalas modulares baseadas em proporções musicais. Gera variáveis CSS prontas para usar no seu design web.

Usar ferramenta

Gerador de Mockups Mobile para App Store. iPhone e Google Pixel

Crie apresentações profissionais para App Store e Google Play. Mockups de iPhone e Pixel com fundos personalizados, layouts panorâmicos e exportação em alta resolução.

Usar ferramenta

Gerador Online de Hash de Segurança

Calcule hashes MD5, SHA-1, SHA-256 e SHA-512 instantaneamente. Ferramenta de segurança gratuita, privada e ultra-rápida para desenvolvedores. 100% Client-Side.

Usar ferramenta

Biblioteca Privada de Prompts IA

Organize, rotule e salve seus prompts do ChatGPT, Midjourney e Claude de forma privada. Seu próprio banco de prompts no localStorage.

Usar ferramenta

Conversor de Cores Online RGB HEX e HSL

Converta cores entre RGB, HEX e HSL instantaneamente. Gere harmonias de cores complementares e analise o contraste WCAG. 100% no lado do cliente e privado.

Usar ferramenta

Sanitizador SVG Online

Otimize e limpe SVGs exportados do Figma, Adobe Illustrator ou Inkscape. Remova metadados, atributos desnecessários e grupos vazios para obter um SVG pronto para produção.

Usar ferramenta

Gerador de Parâmetros UTM para o Google Analytics

Crie links de rastreamento precisos para as suas campanhas de marketing digital. Otimizado para o Google Analytics e outras ferramentas de análise.

Usar ferramenta

Limpador de URL de Rastreamento: Remover UTM, FBCLID e GCLID

Remova automaticamente parâmetros de rastreamento e publicidade de suas URLs. Compartilhe links limpos e proteja sua privacidade digital instantaneamente.

Usar ferramenta

Inspetor de Certificados SSL/TLS Online Visualizar ficheiros PEM e CRT

Analise ficheiros de certificados SSL (.pem, .crt, .der) localmente. Verifique datas de expiração, emissores, titulares e impressões digitais SHA-256 sem que os seus dados saiam do browser.

Usar ferramenta

Gerador Security.txt RFC 9116

Crie seu arquivo security.txt profissional para facilitar a divulgação de vulnerabilidades e cumprir padrões internacionais de segurança da web.

Usar ferramenta

Calculadora de Tempo de Dados: Impacto da Velocidade Web

Descubra quanto tempo de vida os seus usuários perdem esperando o carregamento do seu website em conexões 3G, 4G e 5G. Calcule o impacto real do peso do seu site.

Usar ferramenta

Gerador de Código do Conversor de Tabela Excel e CSV para HTML

Converta instantaneamente os seus dados Excel ou CSV em tabelas HTML limpas e semânticas. Ferramenta gratuita para desenvolvedores e criadores de conteúdo.

Usar ferramenta