Binary Diff / Preview

Visually compare two images or other binary files to spot differences. Perfect for UI reviews, asset checks, and more.

How to Use

1

Upload Files: Upload the 'before' and 'after' files you want to compare using the two upload boxes.

2

Choose Mode: Select a comparison mode, such as 'Pixel Diff', 'Overlay', or 'Slider', to visualize the differences.

3

Analyze Diff: Inspect the output canvas to see the differences highlighted or blended, depending on the chosen mode.

Input Files

Drag & drop or click to upload

Drag & drop or click to upload

Visual Diff

Your visual diff will appear here...

What is a Binary File Diff Tool?

A binary diff tool is used to compare two files at the byte level, but for certain file types like images, a simple byte-by-byte comparison isn't very useful. A visual diff tool, like this one, is specialized for comparing images and other visual assets to highlight the differences in a way that is easy for humans to see.

Common Use Cases

UI & Regression Testing

Compare screenshots of a user interface before and after a code change to catch unintended visual regressions.

Design & Asset Review

Ensure that exported assets like icons or logos match the design mockups perfectly.

Verifying Compression

Check if an image has been altered after compression by comparing it to the original.

SVG & Vector Comparison

Compare rendered versions of SVGs or other vector graphics to spot changes in shapes, colors, or text.

Frequently Asked Questions

What types of files can I diff?

This tool is designed for visual comparison of image files, such as PNG, JPEG, and GIF. It's particularly useful for designers and front-end developers who need to spot subtle visual changes in UI elements, icons, or mockups.

How does the diff work?

The tool provides several methods for comparison. The 'Pixel Diff' mode highlights every pixel that is different between the two images. The 'Overlay' mode lets you see one image layered on top of the other with adjustable opacity. The 'Slider' mode provides a handle you can drag to reveal one image over the other.

Is there a file size limit?

For performance reasons, it's best to use images under 5MB. All processing is done in your browser, so very large images may cause the tool to become slow or unresponsive, depending on your computer's memory and processing power.

Is my data secure?

Yes. Just like all tools on GitGroomer, the Binary Diff / Preview tool runs entirely on the client-side. Your images are never uploaded to a server, ensuring your data remains private and secure.

Can I use this for non-image binary files?

Currently, the tool is optimized for visual diffing of images. While you can upload other binary files, you will not get a meaningful visual comparison. Support for other binary file types may be added in the future.