Loading page
About this tool
Compare two images with slider, side-by-side, and fade overlay modes. Includes resolution and difference analysis.
The Before vs After Comparator puts two images against each other in three viewing modes — a draggable split slider, a side-by-side grid, and a fade overlay with a 0-100 opacity control — and exports the pair as a single labelled PNG. It also reports each image's pixel resolution and flags whether the two match, which is the usual reason a comparison looks misaligned. It is for anyone showing an edit, a repair or a restoration and needing the difference to be obvious at a glance.
Open Before vs After Comparator on AltFTool — it loads instantly in your browser.
Load one image into the Before dropzone and one into the After dropzone — each reads Drop image here or click to browse and Supports JPG, PNG, WEBP, HEIC (max 20MB), and the comparison view opens as soon as both are in.
Switch views with the Slider, Side by-side and Fade buttons above the frame: Slider drags a divider across the pair with Before and After tagged in the bottom corners, and Fade adds a 0-100 opacity slider that dissolves the After image over the Before one.
Press Analyze Differences for a Comparison Analysis panel listing Before Resolution, After Resolution and Resolution Match, Export Comparison to download both frames side by side as before-after-comparison.png, or New to clear the two slots.
Slider, side-by-side and fade each reveal different kinds of change — edges, framing, and subtle tonal shifts respectively.
The analysis panel compares both images' pixel dimensions and warns when they differ, which is what makes an overlay drift.
The PNG comes out double-width with Before and After burned into the corners, so it stays readable wherever it is reposted.
Slider draws one image over the other with a draggable vertical split; side-by-side shows both in a two-column grid; and fade stacks them with an opacity slider from 0 to 100 so you can cross-dissolve between them.
Not to view them, but yes for a clean overlay. The analysis panel reports each image's width and height and marks the pair as a match or different, because the slider and fade modes only line up when the two frames share the same dimensions and crop.
A single PNG at twice the width of the larger source image, with the before image on the left, the after image on the right, and small Before and After captions drawn into the bottom corners of each half.
No. Both images are read into the page, drawn to a canvas for the export, and downloaded from memory. Nothing is transmitted, so unreleased client work stays on your machine.