How to Compare Two Images and Find Every Difference
Four reliable ways to spot what changed between two images (slider, flicker, side by side and pixel difference), when to use each, and how to read a difference heat map.
By DiffSlider team · · 4 min read
Sometimes the difference between two images is obvious: a renovated kitchen, a repainted car. Often it isn’t. A new export of a texture, an AI upscale, a compression setting or a retouched product photo can change thousands of pixels in ways your eye skims over.
There are four reliable ways to compare two images, and each one is good at finding a different kind of change. All of them are built into the comparison tool, and the preview runs in your browser, so you can check private files without uploading anything.
1. Slider: changes in a region
The slider puts both images in one frame, split by a divider you drag. The left side shows one image and the right side the other.
Best for: seeing how an area changed: the detail in a face after upscaling, the texture of a wall after a renovation, the colour grade of a photo.
How to use it well: drag slowly across the area you care about and stop on edges. Zoom in (scroll, pinch or double-click) and keep dragging; both images zoom and pan together, so you compare the same pixels.
Weakness: you only see the change along the divider. A small change on the far side of the image is easy to miss.
2. Toggle (flicker): small shifts and colour changes
Toggle shows one image at a time, in the same place, and switches between them when you click or press a key. This is the oldest trick in astronomy and print proofing, known as blink comparison.
Best for: anything that moved, shifted or changed tone. Your visual system is extremely sensitive to sudden change, so a two-pixel shift or a slight change in brightness “jumps” when you flick between the images.
How to use it well: zoom in to the area first, then toggle. Flick quickly; the longer the gap, the more your eye forgets.
Weakness: it is hard to show to someone else in a screenshot, and it relies on your attention.
3. Side by side: overall layout and composition
Side by side shows the two images next to each other at the same zoom.
Best for: comparing composition, framing and overall look, or when the images are not aligned (for example two different photos of the same product).
Weakness: your eyes move back and forth, so fine detail is the hardest to compare this way. Use it for the big picture, then switch to the slider or toggle.
4. Difference: every changed pixel
The difference view computes the change pixel by pixel. It darkens the first image and lights up every pixel that is different in the second. The brighter a spot, the bigger the change.
Best for: finding where things changed when you don’t know where to look:
- an export that should be identical but isn’t
- the parts of a photo that were retouched
- compression or resizing artefacts
- which areas an AI upscaler or denoiser actually changed
- changes between two versions of a game texture, UI screenshot or map
How to read a difference image
- Black or dark areas didn’t change.
- Bright outlines around every edge usually mean the images are shifted or scaled slightly, not that the content changed. Check that both images have the same size and framing.
- A fine, even noise across the whole image is typical of re-saving a JPEG or of different compression. The content is the same; the encoding isn’t.
- Bright solid shapes are real content changes: something added, removed or edited.
- A brighter overall picture without shapes points to a change in exposure, colour or gamma.
Weakness: it needs aligned images of the same size. Two photos taken by hand will light up everywhere, because no two handheld shots line up to the pixel.
Which method should you use?
| You want to know… | Use |
|---|---|
| How a specific area changed | Slider, zoomed in |
| Whether anything moved or changed tone | Toggle |
| How the overall look or framing differs | Side by side |
| Where anything changed at all | Difference |
| Which of 3+ versions is best | Upload them all, then switch pairs |
In practice, the fastest workflow is difference first, slider second: the difference view tells you where to look, and the slider tells you whether the change is better or worse.
Comparing more than two images
You can add up to ten images to one comparison: several upscaler models, a set of export settings, versions of a design. Choose which two to compare from the image buttons and switch pairs at any time. Label each image with its setting (“JPEG q90”, “Real-ESRGAN 4×”) so viewers know what they’re seeing. See the AI upscaling use case for a typical setup.
Get accurate results
- Use the original files. Screenshots of images, or images saved from chat apps, are often resized and recompressed. Compare the files themselves.
- Same dimensions. Resize or crop both images to the same pixel size before comparing, or the tool scales them to fit the same frame, which itself changes pixels.
- Lossless formats for fine work. PNG keeps every pixel exactly, so a difference view shows only real changes, not compression noise.
- Zoom past 100%. At high zoom, pixels are shown as sharp squares, not smoothed, so you see the real pixel values.
Share what you found
When you’ve found the difference, publish the comparison and send one link. The person you send it to opens it in whichever view you left on, so leave it on Difference to point at a change, or on the Slider to show the result. For bug reports and pull requests, see how to put a comparison in a GitHub README, Reddit post or Discord message.
Compare two images now. No sign-up, and nothing is uploaded until you publish.