Verificador de diferença de imagem

Enviou um ajuste de CSS e quer saber exatamente o que mudou? Comparando duas capturas de tela para uma verificação de regressão visual de controle de qualidade? Quer saber o que realmente mudou entre duas versões exportadas da mesma foto? Rolar para frente e para trás entre duas imagens e apertar os olhos em busca de diferenças é lento e pouco confiável – esta ferramenta sobrepõe as duas e mostra cada pixel alterado em uma imagem.

A comparação é uma matemática real de diferenciação de pixels, a mesma família de algoritmos usada por ferramentas como pixelmatch: cada pixel de ambas as imagens é convertido de RGB em espaço de cores YIQ (Y = luma, I e Q = os eixos de crominância NTSC), e a distância euclidiana entre os dois pontos YIQ é calculada. Essa distância é comparada com um limite definido pelo controle deslizante de sensibilidade – aumente a sensibilidade para capturar mudanças sutis de cores, diminua-a para ignorar o ruído de compressão e se preocupe apenas com mudanças óbvias.

Uma comparação ingênua por pixel iluminaria cada borda suavizada como "diferente", mesmo quando nada significativo mudasse, porque a suavização muda alguns pixels da borda em alguns tons. Esta ferramenta executa uma heurística anti-aliasing real em ambas as imagens: um pixel só é tratado como uma diferença genuína se NÃO estiver dentro de um gradiente de suavização - concretamente, se sua própria vizinhança 3x3 em qualquer imagem de origem ainda não contiver um pixel mais claro e um pixel mais escuro do que ele mesmo, que é a impressão digital de uma borda suavizada por AA em vez do conteúdo real.

Carregue a imagem A e a imagem B, ajuste a sensibilidade se necessário e pressione Executar. Você obtém uma porcentagem exata de pixels diferentes, além de uma imagem diferente com cada mudança real destacada em magenta brilhante sobre uma versão esmaecida do original - baixe-a e anexe-a diretamente ao seu relatório de bug ou notas de controle de qualidade. Ambas as imagens devem ter as mesmas dimensões; caso contrário, a ferramenta informará claramente, em vez de cortar ou esticar silenciosamente um deles. Nada sai do seu navegador em nenhum momento.