How are differences highlighted?

Pixels where the two images differ by more than a small threshold in any RGB channel are drawn in red on the diff canvas. Identical pixels are shown as semi-transparent to keep the context visible.

Do both images need to be the same size?

For accurate comparison the images should be the same dimensions. If they differ, the tool compares the overlapping region and flags the non-overlapping area as different.

What does the percentage represent?

The percentage is the number of differing pixels divided by the total pixel count of the comparison area, expressed as a percentage.

Image Diff

Compare two images pixel by pixel and visualize the differences.

Image A

Image B

Related Tools

(i)Image Metadata Viewer

View file info and basic EXIF metadata from uploaded images.

<->Image Size Checker

Instantly check an image's dimensions, file size, format, and megapixels.

#cImage Color Picker

Click any pixel in an uploaded image to get its HEX, RGB, and HSL color values.

FAQ

How are differences highlighted?: Pixels where the two images differ by more than a small threshold in any RGB channel are drawn in red on the diff canvas. Identical pixels are shown as semi-transparent to keep the context visible.
Do both images need to be the same size?: For accurate comparison the images should be the same dimensions. If they differ, the tool compares the overlapping region and flags the non-overlapping area as different.
What does the percentage represent?: The percentage is the number of differing pixels divided by the total pixel count of the comparison area, expressed as a percentage.

The Image Diff tool uploads two images, aligns them on canvases, and compares their pixel data using getImageData. Pixels that differ are highlighted red in a third diff canvas, and the overall percentage of differing pixels is shown. Useful for visual regression testing, comparing screenshots, or spotting subtle differences between image versions.