Image Diff Checker
Compare two images pixel by pixel and instantly see exactly what changed, with a highlighted diff image and a percentage summary — all processed locally in your browser.
🔒 Processed locally in your browser
Loading…
How to use
- Drag and drop (or click to choose) your original image into the "Before" dropzone.
- Drag and drop (or click to choose) the image you want to compare it against into the "After" dropzone.
- Click "Compare Images" — the two images are compared pixel by pixel entirely in your browser.
- Review the highlighted diff image and the percentage of differing pixels, then download the diff image if needed.
Features
- Pixel-level comparison powered by the open-source pixelmatch library
- Highlights every differing pixel on a dimmed background so changes are easy to spot
- Shows an exact count and percentage of differing pixels
- Clearly flags images with mismatched dimensions instead of comparing them incorrectly
- 100% client-side — your images are never uploaded to a server
Frequently asked questions
What is this tool useful for?
It's great for visual regression testing (checking that a UI didn't change unexpectedly between builds), comparing two versions of a design or screenshot, spotting subtle edits in a photo, or verifying that an image was recompressed without visible quality loss.
Why do my two images need the same dimensions?
The comparison works pixel by pixel, matching each pixel in the first image to the pixel at the same position in the second. If the images are different sizes there's no meaningful 1:1 mapping, so the tool shows a clear error instead of comparing mismatched data.
How is the diff image generated?
The tool uses pixelmatch, an open-source pixel comparison library. Matching areas are dimmed, and pixels that differ beyond a small anti-aliasing-aware threshold are highlighted in a bright color so they stand out immediately.
Are my images uploaded anywhere?
No. Both images are loaded and compared entirely inside your browser using the Canvas API. Nothing is sent to a server.
Why might two visually identical images still show some differing pixels?
Minor differences in compression, color profiles, or re-encoding can shift individual pixel values slightly even when images look identical to the eye. A very small percentage of differing pixels usually indicates this kind of noise rather than a real visual change.