Quais formatos de imagem são suportados?

Você pode enviar capturas de tela nos formatos PNG, JPEG e WEBP com tamanho de até 15 MB.

Qual a diferença entre os níveis WCAG AA e AAA?

O nível AA exige uma taxa de contraste de 4.5:1 para textos normais, enquanto o nível AAA é mais rigoroso, exigindo uma taxa de 7:1.

Como a ferramenta analisa o código HTML?

Ela inspeciona os pares de cores de texto e fundo definidos inline no HTML fornecido e calcula a taxa de contraste entre eles.

O que são as sugestões de cores de ajuste?

São recomendações automáticas de valores hexadecimais para o texto ou fundo que garantem a aprovação no nível WCAG selecionado.

Posso usar a ferramenta apenas com imagens sem enviar HTML?

Sim, você pode enviar apenas uma captura de tela da interface. A ferramenta fará uma amostragem das cores locais para estimar os pontos críticos de contraste.

Elysia Tools

Navegação

Design

Gerador de heatmap de acessibilidade

Gera um heatmap de acessibilidade focado em contraste a partir de captura ou HTML e sugere cores de ajuste

Detalhes

O que esta ferramenta ajuda você a fazer

Envie uma captura de UI ou cole HTML com cores inline. A ferramenta gera um heatmap de regioes com risco de falhar WCAG e sugere cores de ajuste.

Execução

Executar esta ferramenta

Preencha o formulário, execute a ferramenta e veja o resultado no mesmo lugar.

Execuções de exemplo preparadas

Clique em um exemplo para preencher o formulário automaticamente. Arquivos ainda precisam ser enviados.

1 exemplos

Gerar um heatmap a partir de uma captura com baixo contraste

Destaca areas de risco e sugere cores de ajuste.

{
  "type": "file",
  "filePath": "/public/samples/html/accessibility-heatmap-example-report.html"
}

Entradas

Preencha os campos necessários e execute a ferramenta.

4 opções

ArquivosEnvie os arquivos de origem para este fluxo.1

Imagem de designfileOpcional

Tamanho máximo por arquivo: 15 MBTipos aceitos: image/png, image/jpeg, image/webp, .png, .jpg, .jpeg, .webp

ConteúdoCole ou digite os valores principais.1

Entrada HTMLtextareaOpcional

ConfiguraçõesAjuste formatos, intervalos, números e modos.1

Nivel WCAGselectOpcional

AlternânciasAtive ou desative comportamentos opcionais.1

Mostrar sugestoescheckboxOpcionalAtivo quando marcado

Resultado

Pronto para executar

Depois de executar, arquivos, texto, dados estruturados ou saída em streaming aparecerão aqui.

Exemplos

Exemplos compatíveis com esta ferramenta

Relacionado

Gerador de heatmap de acessibilidade

O que esta ferramenta ajuda você a fazer

Executar esta ferramenta

Execuções de exemplo preparadas

Entradas

Resultado

Exemplos compatíveis com esta ferramenta

Continue com ferramentas e temas relacionados

Execuções de exemplo preparadas

Entradas

Resultado

Veja quando usar esta ferramenta, o que ela suporta e como os usuários a aplicam.

Fatos principais

Visão geral

Quando usar

Como funciona

Casos de uso

Exemplos

1. Auditoria de contraste em protótipo de UI

2. Correção de acessibilidade em componentes HTML

Perguntas frequentes

Exemplos de Processamento de Imagem Web Python

Exemplos de Processamento de Imagem Android Java

Exemplos de Processamento de Imagem Android Kotlin

Exemplos de Processamento de Imagem Web Rust

Gerador de Faturas PDF

Gerador de Data URI

Gerador de Mapa de Profundidade

Gerador de Animação Parallax

Ferramentas de auditoria de acessibilidade web e cores acessiveis

Ferramentas de conversao de formatos de imagem e exportacao animada

Ferramentas de extração, limpeza e exportação de HTML para Markdown/PDF

Ferramentas de limpeza, acabamento e preparo em lote de imagens