Skip to content

Image Tools

Image Compare

Load two images and inspect their differences with side-by-side, overlay, and slider views.

Processed locally in your browser. Your files are not uploaded.

Image A

Click to browse or drag and drop
Drop first image

Image B

Click to browse or drag and drop
Drop second image

Comparisons Only Mean Something at the Same Scale

Placing a 4000×3000 original next to its compressed copy only reveals quality loss when both are viewed at identical zoom — comparing the compressed one at 100% against the original fitted-to-screen exaggerates the difference. For compression decisions, judge at the size the image will actually be seen: artifacts invisible at display size are not real costs. Side-by-side sliders are for alignment checks (before/after edits), while A/B toggles are better for subtle quality judgment because they remove the eye-switching bias.

Getting More Out of a Comparison

Side-by-side shows overall differences, the overlay with adjustable opacity reveals shifts in position, and the slider is best for judging compression or colour changes at the exact same spot. Zoom in to 200 percent on edges and gradients, because that is where lossy compression shows first.

For a fair test, both images must have the same dimensions. If one is scaled, the softness you see may come from scaling, not from the format or settings you are comparing. Use it to decide the lowest quality setting you can accept before committing to a batch export.

How the Comparison Views Work

  1. Load a first image as the reference (for example, the original photo).
  2. Load a second image to compare (for example, the compressed or edited version).
  3. Switch between Side-by-side, Overlay, and Slider modes to inspect the differences.
  4. Drag the slider handle back and forth to spot compression artifacts, color shifts, or cropping differences.

Typical Use

Judge compression quality visually
Input: original.png vs compressed-70.jpg
Output: Slider view reveals artifacts only in high-contrast areas
A before/after slider is the fastest way to decide whether a quality level is acceptable before shipping website assets.
Compare two exports
Input: webp-q80.webp vs jpg-q90.jpg
Output: Side-by-side view at 100% zoom
Comparing two formats side by side at 100% zoom shows color and detail differences that thumbnails hide.

Common Questions

Are both images processed locally?

Yes. Both files are read and rendered only in your browser for complete privacy, which matters when comparing unpublished content.

Do the images need the same dimensions?

No. The slider works best when both images share dimensions, but the tool scales both to fit the viewer regardless.

Can I export the comparison?

The tool is designed for on-screen inspection. Use a screenshot if you need a static record of the comparison view.