Comparador de Imagens
Compare duas imagens pixel a pixel e veja instantaneamente o que mudou, com uma imagem de diferenças destacada e um resumo percentual — tudo processado localmente no seu navegador.
🔒 Processado localmente no seu navegador
Loading…
Como usar
- Arraste e solte (ou clique para escolher) sua imagem original na área "Antes".
- Arraste e solte (ou clique para escolher) a imagem com a qual deseja compará-la na área "Depois".
- Clique em "Comparar Imagens" — as duas imagens são comparadas pixel a pixel inteiramente no seu navegador.
- Analise a imagem de diferenças destacada e o percentual de pixels diferentes, e baixe a imagem de diferenças se necessário.
Funcionalidades
- Comparação pixel a pixel usando a biblioteca de código aberto pixelmatch
- Destaca cada pixel diferente sobre um fundo esmaecido para facilitar a identificação de mudanças
- Mostra a contagem exata e o percentual de pixels diferentes
- Sinaliza claramente imagens com dimensões diferentes em vez de compará-las incorretamente
- 100% no lado do cliente — suas imagens nunca são enviadas a um servidor
Perguntas frequentes
Para que serve esta ferramenta?
É ótima para testes de regressão visual (verificar se a interface não mudou inesperadamente entre builds), comparar duas versões de um design ou captura de tela, identificar edições sutis em uma foto, ou verificar se uma imagem foi recomprimida sem perda visível de qualidade.
Por que minhas duas imagens precisam ter as mesmas dimensões?
A comparação funciona pixel a pixel, associando cada pixel da primeira imagem ao pixel na mesma posição da segunda. Se as imagens tiverem tamanhos diferentes, não há um mapeamento 1:1 significativo, então a ferramenta exibe um erro claro em vez de comparar dados incompatíveis.
Como a imagem de diferenças é gerada?
A ferramenta usa o pixelmatch, uma biblioteca de código aberto para comparação de pixels. As áreas coincidentes ficam esmaecidas, e os pixels que diferem além de um pequeno limite que considera o antialiasing são destacados em uma cor vibrante para chamar atenção imediatamente.
Minhas imagens são enviadas para algum lugar?
Não. Ambas as imagens são carregadas e comparadas inteiramente dentro do seu navegador usando a API Canvas. Nada é enviado a um servidor.
Por que duas imagens visualmente idênticas podem mostrar alguns pixels diferentes?
Pequenas diferenças de compressão, perfis de cor ou recodificação podem alterar levemente valores de pixels individuais mesmo quando as imagens parecem idênticas a olho nu. Uma porcentagem muito pequena de pixels diferentes geralmente indica esse tipo de ruído, e não uma mudança visual real.