Bilder vergleichen — Unterschiede online finden
Findet und markiert abweichende Pixel zweier Bilder, mit Überlagerung und Schieberegler
Verarbeitung im Browser · kein Hochladen
Bild A (Original)
Bild A (Original)
Fügen Sie zuerst das Referenzbild hinzu. JPG, PNG, WebP, GIF oder BMP; Einfügen mit Strg+V geht auch.
Bild B (geändert)
Bild B (geändert)
Fügen Sie das geänderte Bild hinzu. Sobald A geladen ist, landet ein Einfügen (Strg+V) in B.
0 erfasst die kleinste Farbänderung; höhere Werte behandeln ähnliche Farben als gleich. Der Standard 0,1 ignoriert typisches JPG-Kompressionsrauschen.
Wenn aus, werden abweichende weiche Kantenpixel gelb angezeigt und nicht mitgezählt.
Fügen Sie beide Bilder hinzu, dann startet der Vergleich sofort.
Was macht das Tool?
Es findet, wo sich zwei ähnlich aussehende Bilder unterscheiden, bis auf einzelne Pixel genau. Kleine Textänderungen, eine Verschiebung um 1 Pixel oder eine Farbänderung, die Ihnen beim Hin- und Herschalten entgehen würden, werden rot markiert. So prüfen Sie, ob eine Website-Änderung wie gewünscht dargestellt wird, finden heraus, was ein Designer in einer Revision geändert hat, oder kontrollieren einen Druckproof. Neben der Differenzansicht können Sie die Bilder überlagern oder mit einem Vorher-nachher-Schieberegler teilen.
So geht’s
- Legen Sie das Referenzbild in Bild A (Original) und das geänderte in Bild B (geändert). Screenshots lassen sich mit Strg+V einfügen; ist A belegt, landet das Einfügen in B.
- Der Vergleich startet, sobald beide Bilder da sind: Anzahl und Anteil abweichender Pixel sowie die Position des geänderten Bereichs erscheinen.
- Mit Empfindlichkeit legen Sie fest, wie viel kleine Farbabweichung ignoriert wird.
- Wählen Sie unter Ansicht Unterschiede, Überlagerung (mit der Deckkraft von B) oder Schieberegler (A links, B rechts).
- Klicken Sie auf Differenzbild als PNG speichern, um das Ergebnis herunterzuladen.
So funktioniert es
- Pixelvergleich: Farben an derselben Position werden über ihren Abstand im YIQ-Farbraum verglichen, der der menschlichen Helligkeitswahrnehmung folgt. Ein Schwellenwert von 0 erfasst die kleinste Änderung, Werte nahe 1 sind nachsichtig. Standard ist 0,1.
- Kantenglättung: Als weiche Kanten erkannte Pixel, beurteilt anhand ihrer Nachbarn, werden gelb gezeichnet und nicht mitgezählt (optional).
- Differenzbild: Unveränderte Bereiche zeigen das Original als blasses Grau (10 %), abweichende Pixel in Rot.
- Größe: Über 8 Millionen Pixeln werden beide Bilder für den Vergleich um denselben Faktor verkleinert, und die Koordinaten des geänderten Bereichs werden auf die Originalpixel von A zurückgerechnet.
- Die Vergleichs-Engine ist pixelmatch (ISC-Lizenz).
Beispiele
| A | B | Ergebnis |
|---|---|---|
| Screenshot vorher, 1280×800 | Dieselbe Seite mit neuem Schaltflächentext | Rot nur um die Schaltfläche, Koordinaten des Bereichs angezeigt |
| Foto als PNG | Dieselbe Datei noch einmal | Meldung „Keine Unterschiede“ |
| Banner 1200×600 | Banner auf 1000×600 zugeschnitten | Bei behaltenen Größen ist der ganze abgeschnittene 200-px-Streifen anders |
Für Unterschiede in Texten nutzen Sie den Textvergleich; um einen Bildausschnitt genauer anzusehen, probieren Sie das Zuschneide-Tool.
Häufige Fragen
Kann ich unterschiedlich große Bilder vergleichen?
Ja. „B an A anpassen“ ist für denselben Bildschirm in anderer Auflösung gedacht, „Größen behalten, oben links ausrichten“ für ein zugeschnittenes oder erweitertes Bild. Bei behaltenen Größen gilt alles, was nur ein Bild abdeckt, als unterschiedlich.
Bei JPG-Bildern werden viel zu viele Unterschiede angezeigt.
JPG-Komprimierung hinterlässt winzige, unsichtbare Farbänderungen. Erhöhen Sie den Schwellenwert von 0,1 auf etwa 0,2–0,3, dann wird dieses Rauschen ignoriert und echte Änderungen bleiben.
Was bedeuten die gelben Pixel?
Weiche Kantenpixel von Text und Linien (Kantenglättung), die leicht abweichen, oft nur durch die Schriftdarstellung. Standardmäßig werden sie gelb angezeigt und nicht mitgezählt; aktivieren Sie die Option, um sie mitzuzählen.
Wofür ist das gut?
Um Screenshots vor und nach einer Website-Änderung zu vergleichen, Änderungen in einer Designrevision zu finden, einen Druckproof mit dem Original abzugleichen oder für Suchbilder.
Werden meine Bilder hochgeladen?
Nein. Beide Bilder werden ausschließlich in Ihrem Browser verglichen.
