logo hsb.horse

Comparador de Imagens

Compare duas imagens no navegador, destaque as diferenças em magenta e ajuste a tolerância para ignorar ruídos de compressão. Nenhum arquivo sai do seu dispositivo.

Envie uma imagem de referência e outra para comparação para obter um overlay magenta e uma taxa de correspondência calculada. Todo o processamento é local.

1. Envie a imagem de referência

Escolher imagem de referência

2. Envie a imagem para comparar

Escolher imagem para comparar

3. Sensibilidade da comparação

Tolerância: 0%

Rigorosa (0) Flexível (100)

Tolerância: 0%

A compressão JPEG pode gerar pequenas diferenças de pixel. Aumente a tolerância para ignorar ruídos aceitáveis; use 0% para verificação rígida.

Resultado

Aguardando duas imagens

Taxa de correspondência
–
Pixels diferentes
–
Total de pixels
–
Magenta = diferenças
Cinza = áreas iguais (prévia da referência)

Prévia do diff

Envie duas imagens para começar

Casos de uso

Checks de regressão de UI

Compare capturas antes e depois para encontrar mudanças visuais indesejadas antes do deploy.

QA de assets

Garanta que banners ou thumbnails comprimidos ainda correspondam ao arquivo aprovado.

Conformidade e evidência

Compartilhe uma taxa de correspondência quantificada em revisões ou auditorias sem enviar arquivos a serviços externos.

Dicas

  • Mantenha referência e comparação com a mesma orientação. Grandes diferenças de proporção geram muitos deltas.
  • Para imagens muito grandes, mantenha a guia ativa para evitar que o navegador reduza a velocidade do cálculo.
  • Pixels totalmente transparentes são ignorados. Adicione um fundo sólido se precisar comparar bordas transparentes com precisão.

Como usar

  1. 1

    Adicionar a imagem de referência

    Envie a imagem base (golden) que servirá como verdade.

  2. 2

    Adicionar a imagem de comparação

    Envie o screenshot ou exportação a verificar. Dimensões diferentes são redimensionadas automaticamente para a referência.

  3. 3

    Ajustar a tolerância e ler o diff

    Mova o controle de tolerância para ignorar ruídos de compressão. Analise o overlay magenta e a porcentagem de correspondência informada.

Perguntas frequentes

Minhas imagens são enviadas para um servidor?
Não. Todo o processamento acontece no seu navegador. Os arquivos não saem do seu dispositivo e não são armazenados em servidores.
Quais formatos de imagem são suportados?
Qualquer formato que o navegador abra: JPEG, PNG, WebP, GIF, BMP, SVG, AVIF e outros. O diff é desenhado em um canvas para inspeção rápida.
Como são tratadas transparência e alpha?
Pixels totalmente transparentes em ambas as imagens são considerados iguais, mesmo com RGB diferente. Caso contrário, a diferença de alpha conta no diff.
Como escolher o valor de tolerância?
Use 0% para verificações rígidas, 1–5% para exports comprimidos e valores maiores quando precisar tolerar diferenças de anti-aliasing ou renderização de fontes.