Image Diff Viewer

Compare two images and see exactly what changed. Slide between them horizontally or vertically, blink or blend them over each other, view them side by side, and let the pixel diff highlight every changed region with a difference percentage.

Everything runs locally in your browser. Your data never leaves your device.

Pick two images

The before image is the reference and the after image is compared against it.

Before

the reference version

PNG, JPEG, WebP · click or drop

After

the changed version

PNG, JPEG, WebP · click or drop

Load both images to compare them. Screenshots, renders and photo edits all work, and the images don't need to be the same size.

Next steps

Send this tool's output straight into another tool.

JPG Image Compressor

Shrink any image with as little quality loss as possible. Pick a WhatsApp, Instagram or Discord preset, or switch to Custom to hit a hard file size or a fixed quality, downscale with aspect-locked resolution sliders, and keep or strip EXIF metadata. Live preview, multiple images at once.

media image compress

Image Converter

Convert images between JPEG, PNG, WebP and AVIF. Drop in as many as you like, pick a format, and dial in the quality for the lossy ones. When you convert to JPEG, choose the colour that fills any transparency. Live previews, download one or all at once.

media image converter

EXIF Editor

See and edit the EXIF metadata inside a photo, then download it with your changes or save a copy with all metadata removed, GPS included. It reads JPEG, PNG, HEIC and more, and edits JPEG files.

media image exif

EXIF Transfer

Copy the EXIF metadata from one photo onto another without changing the destination's pixels. That covers camera model, lens, focal length, exposure, GPS and more. Choose to replace all metadata or only fill in what the source provides.

media image exif

Image Annotator

Draw arrows, boxes, text, highlights and numbered steps on a screenshot, blur or pixelate anything private, crop the result and add a watermark. The finished image downloads as PNG or JPG or goes straight to your clipboard.

media image

Hash Generator

Hash text or a file with MD5, SHA-1, SHA-256, SHA-512, SHA-3, BLAKE2, BLAKE3, CRC32 and more, all computed live as you type. Compare against an expected checksum and copy any digest.

dev security

Checksum Validator

Verify a checksum online: drop a file, paste the expected checksum and see instantly whether they match. The hash type is detected from the checksum itself, covering MD5, SHA-1, SHA-256, SHA-512, BLAKE3, CRC-32 and more, and sha256sum lines or whole checksum files can be pasted as-is.

dev security

Data Compressor

Compress text or a file with gzip, deflate, brotli or Zstandard and see the size before and after, the compression ratio and how long it took. One click tries every method and recommends the smallest result.

dev compress

Data Decompressor

Decompress gzip, deflate, brotli or Zstandard data from a file or pasted Base64 and read the result as text or download it. Detects the format from the magic bytes where possible, with a manual override.

dev compress

About the Image Diff Viewer Tool

This tool compares two images and shows you exactly what changed between them. Load a before and an after version and switch between six views: a swipe slider you can drag horizontally or vertically, an onion-skin blend with an opacity slider, a blink mode that flips between the two automatically or on demand, a side-by-side layout, a pixel diff that highlights every changed pixel in a color of your choice, and an amplified difference view for changes too subtle to see.

The pixel comparison is powered by pixelmatch, the library behind many visual regression test runners. It reports the changed pixel count and percentage, can skip anti-aliasing artifacts, and can draw boxes around each changed region. The diff image downloads as a PNG or copies straight to the clipboard. For text instead of pixels, use the Text Diff, and for structured data the JSON Diff.

What you can do

Compare two screenshots and spot every pixel that changed.
Slide between a before and after image, horizontally or vertically.
Blend two images over each other with an adjustable opacity.
Blink between two versions to make small changes pop out.
Highlight changed pixels with a tunable matching threshold.
Ignore anti-aliasing differences in a visual regression check.
Draw boxes around the regions that changed.
Get the changed pixel count and difference percentage.
Export the diff as a PNG or copy it to the clipboard.

How to use the Image Diff Viewer

1Load the before image (the reference) and the after image.
2Pick a view: swipe, onion skin, blink, side by side, pixel diff or difference.
3In the pixel diff view, tune the threshold, pick a highlight color and box the changed regions if you like.
4Read the stats: changed pixels, percentage and the compared canvas size.
5Download the diff as a PNG or copy it to the clipboard.

How the pixel diff works

Every pixel of the after image is compared against the same position in the before image using pixelmatch's perceptual color metric, which weighs differences the way the eye does rather than by raw channel values. The threshold slider sets how big a color difference has to be before a pixel counts as changed: 0 flags any difference at all, higher values tolerate small color shifts like the ones re-encoding a JPEG introduces. Pixels that only differ because of anti-aliasing, the soft edges around rendered text and shapes, are detected and skipped by default so a one-pixel text shift doesn't light up the whole page.

The difference view takes a different approach: it shows the absolute per-channel difference between the two images, black where they agree and brighter where they diverge. The amplify slider multiplies that difference, which makes even a one-step color change visible.

Images of different sizes

The two images don't have to match in size. They are laid out on the union of both sizes, anchored at the top left corner, and the area only one image covers counts as changed. That keeps the comparison honest when a screenshot grew taller, but it also means a small crop shift changes almost every pixel. If one image is a cropped or resized copy, align it first with the Image Cropper & Resizer.

What the export contains

The download and copy buttons export the current diff rendering as a PNG: the pixel diff view with your threshold, highlight color and region boxes, or the difference view when that one is active. Very large images beyond roughly 32 megapixels are scaled down to what a browser canvas can hold before comparing.

Credits

Open source does the heavy lifting in this tool. Thank you to:

pixelmatch
A small and precise pixel-level image comparison library.

Everything this site builds on is listed on the credits page.

Barcode Generator

Create barcodes in dozens of formats, from EAN-13, UPC-A and Code 128 to QR Code, Data Matrix and PDF417. Type the content, tune the size, colors and text options, and download the result as PNG or SVG.

media image dev

Favicon Generator

Turn any image into a complete favicon set: a multi-size favicon.ico, PNG icons in every common size, Apple touch and Android icons, a web manifest and the HTML tags to paste into your page. Download everything as a zip.

dev image media

SVG Optimizer

Shrink an SVG with SVGO. Paste the markup or drop a file, toggle every optimizer plugin individually, set the numeric precision and multipass, and compare the size before and after. Copy the result or download it as a file.

media image compress dev

Aspect Ratio Calculator

Enter a resolution to get its simplified aspect ratio, or start from a ratio and one side to get the missing dimension. Knows the common ratios like 16:9, 4:3 and 21:9 and shows how close your size is to each.

calculator image dev

Color Blindness Simulator

See any image the way people with a color vision deficiency see it. Upload a picture and preview protanopia, deuteranopia, tritanopia, the milder anomalous forms and monochromacy next to the original, then download any simulation as a full resolution PNG.

media image color

Color Palette Extractor

Pull the dominant colors out of any image as a ready-to-copy palette. Choose how many colors you want, copy each one as HEX, RGB or HSL, and export the whole palette at once.