Bild-Differenz-Prüfung
Laden Sie zwei Bilder hoch und sehen Sie einen pixelgenauen visuellen Diff zwischen ihnen, mit perzeptuellem YIQ-Vergleich und Anti-Aliasing-fähiger Hervorhebung – 100 % lokal in Ihrem Browser.
🔒 Wird vollständig in Ihrem Browser verarbeitet – nichts, was Sie hier eingeben, wird jemals hochgeladen.
Ergebnis
Haben Sie eine CSS-Anpassung ausgeliefert und möchten genau wissen, was sich verschoben hat? Vergleichen Sie zwei Screenshots für einen visuellen Regressionscheck in der QA? Fragen Sie sich, was sich zwischen zwei exportierten Versionen desselben Fotos tatsächlich geändert hat? Zwischen zwei Bildern hin- und herzuscrollen und nach Unterschieden zu suchen ist langsam und unzuverlässig – dieses Tool legt beide übereinander und zeigt Ihnen jedes veränderte Pixel in einem Bild.
Der Vergleich basiert auf echter Pixel-Diff-Mathematik, derselben Algorithmenfamilie, die von Werkzeugen wie pixelmatch verwendet wird: Jedes Pixel beider Bilder wird von RGB in den YIQ-Farbraum konvertiert (Y = Luma, I und Q = die NTSC-Chrominanzachsen), und der euklidische Abstand zwischen den beiden YIQ-Punkten wird berechnet. Dieser Abstand wird mit einem Schwellenwert verglichen, der durch den Empfindlichkeitsregler festgelegt wird – erhöhen Sie die Empfindlichkeit, um subtile Farbverschiebungen zu erfassen, senken Sie sie, um Kompressionsrauschen zu ignorieren und sich nur auf offensichtliche Änderungen zu konzentrieren.
Ein naiver Pixel-für-Pixel-Vergleich würde jede anti-alias-geglättete Kante als „anders“ markieren, selbst wenn sich inhaltlich nichts geändert hat, da die Glättung eine Handvoll Randpixel um wenige Farbstufen verschiebt. Dieses Tool wendet eine echte Anti-Aliasing-Heuristik auf beide Bilder an: Ein Pixel wird nur dann als echter Unterschied behandelt, wenn es NICHT innerhalb eines Glättungsgradienten liegt – konkret, wenn seine eigene 3×3-Nachbarschaft in einem der beiden Quellbilder nicht bereits sowohl ein helleres als auch ein dunkleres Pixel als es selbst enthält, was den Fingerabdruck einer durch AA geglätteten Kante darstellt und nicht eines tatsächlichen Inhalts.
Laden Sie Bild A und Bild B hoch, passen Sie bei Bedarf die Empfindlichkeit an und klicken Sie auf Ausführen. Sie erhalten einen exakten Prozentsatz abweichender Pixel sowie ein Diff-Bild, in dem jede reale Änderung in leuchtendem Magenta über einer abgedunkelten Version des Originals hervorgehoben ist – laden Sie es herunter und hängen Sie es direkt an Ihren Bug-Report oder Ihre QA-Notizen. Beide Bilder müssen dieselben Abmessungen haben; falls nicht, informiert Sie das Tool klar darüber, statt eines der Bilder stillschweigend zu beschneiden oder zu strecken. Zu keinem Zeitpunkt verlassen Daten Ihren Browser.