Afbeeldingsverschilcontrole
Upload twee afbeeldingen en bekijk een pixel-nauwkeurige visuele diff ertussen, met perceptuele YIQ-vergelijking en anti-aliasing-bewuste markering — 100% lokaal in je browser.
🔒 Wordt volledig in uw browser verwerkt. Niets wat u hier invoert, wordt ooit geüpload.
Resultaat
Heb je een CSS-aanpassing doorgevoerd en wil je precies weten wat er versprongen is? Vergelijk je twee schermafbeeldingen voor een visuele QA-regressietest? Vraag je je af wat er werkelijk is veranderd tussen twee geëxporteerde versies van dezelfde foto? Heen en weer scrollen tussen twee afbeeldingen en turen naar verschillen is traag en onbetrouwbaar — deze tool legt de twee over elkaar heen en toont je elke gewijzigde pixel in één beeld.
De vergelijking is echte pixel-diff-wiskunde, dezelfde familie van algoritmes die gebruikt wordt door tools als pixelmatch: elke pixel van beide afbeeldingen wordt van RGB omgezet naar de YIQ-kleurruimte (Y = luma, I en Q = de NTSC-chrominantie-assen), en de Euclidische afstand tussen de twee YIQ-punten wordt berekend. Die afstand wordt vergeleken met een drempelwaarde ingesteld via de gevoeligheidsschuif — verhoog de gevoeligheid om subtiele kleurverschuivingen te vangen, verlaag hem om compressieruis te negeren en alleen op duidelijke veranderingen te letten.
Een naïeve per-pixel vergelijking zou elke anti-aliased rand oplichten als 'anders', zelfs als er niets zinnigs is veranderd, omdat afvlakking een handvol randpixels een paar tinten verschuift. Deze tool past een echte anti-aliasing-heuristiek toe op beide afbeeldingen: een pixel wordt alleen als echt verschil behandeld als hij NIET in een afvlakkingsverloop zit — concreet, als zijn eigen 3×3 buurt in een van beide bronafbeeldingen niet al een zowel lichtere als donkerdere pixel dan zichzelf bevat, wat de vingerafdruk is van een AA-afgevlakte rand in plaats van echte inhoud.
Upload Afbeelding A en Afbeelding B, pas indien nodig de gevoeligheid aan en druk op Uitvoeren. Je krijgt een exact percentage pixels dat verschilt plus een diff-afbeelding waarin elke echte wijziging fel magenta is gemarkeerd bovenop een gedimde versie van het origineel — download het en voeg het rechtstreeks toe aan je bugrapport of QA-aantekeningen. Beide afbeeldingen moeten dezelfde afmetingen hebben; zo niet, dan vertelt de tool je dat duidelijk in plaats van stilletjes één van de twee bij te snijden of uit te rekken. Er verlaat nooit iets je browser op enig moment.