The Video Frame Diff tool extracts frames from two video files and compares them pixel by pixel. Use the timeline scrubbers to select frames at any timestamp, then generate a diff heatmap to see exactly what changed between the two videos.
A Video A
B Video B
Auto-Scan steps through videos at 1-second intervals to find most-changed frames.
Video A Frame
Video B Frame
Diff Heatmap
Auto-Scan Timeline
Pixel difference intensity at each second. Taller bars = more changes. Click a bar to jump to that timestamp.
How to Use the Video Frame Diff Tool
The Video Frame Diff tool compares individual frames from two video files using the same pixel-level algorithm as the Image Diff Tool. It's useful for video editors checking before/after color grading, developers testing video rendering pipelines, and content creators verifying visual consistency between exports.
Step 1: Upload Your Videos
Click the upload areas to select Video A and Video B. MP4 and WebM files work best across all browsers. Files up to 100MB each are supported. The videos load entirely in your browser — nothing is uploaded to any server.
Step 2: Select Frames to Compare
Once loaded, each video shows a frame preview and a timeline scrubber. Drag the scrubber to navigate to any moment in the video. The frame preview updates in real time as you scrub. Use this to align the two videos at comparable moments before running the comparison.
Step 3: Compare Frames
Click "Compare Frames" to extract the current frames from both videos and run a pixel-level comparison. The results show three panels: Video A's frame, Video B's frame, and the diff heatmap. Changed pixels appear in hot pink; matching pixels are shown in dimmed grayscale. Stats show total pixels compared, different pixel count, and percentage changed.
Step 4: Use Auto-Scan to Find Differences
Auto-Scan steps through both videos simultaneously at 1-second intervals, calculating the pixel difference at each second. The results are shown as a bar chart where taller bars indicate more visual difference. Click any bar to jump both video scrubbers to that timestamp and run an instant comparison. This is ideal when you don't know which specific moment changed.
Step 5: Download the Comparison
Click "Download" to save a three-panel PNG showing Video A's frame, Video B's frame, and the diff heatmap side by side. Useful for bug reports, review documents, or archiving visual changes.
FAQ
Is the Video Frame Diff tool free?
Yes, completely free with no account required. All video processing happens in your browser using Canvas API — your videos are never uploaded to any server.
Are my videos private when using this tool?
Yes. The tool runs entirely in client-side JavaScript. Your video files never leave your device and are not stored or transmitted anywhere.
What video formats are supported?
Any video format your browser supports: MP4 (H.264/H.265), WebM (VP8/VP9), MOV, AVI, and OGG. MP4 and WebM have the widest browser support. Files are limited to 100MB each.
How does frame extraction work?
The tool loads your video using the HTML5 video element, seeks to the selected timestamp using the currentTime property, then draws the frame to a Canvas element and reads the pixel data using getImageData(). This is the same method browsers use for video thumbnails.
What is Auto-Scan mode?
Auto-Scan steps through both videos at 1-second intervals and calculates the pixel difference at each second. The results are shown as a mini timeline bar chart, making it easy to spot which moments in the video have the most visual differences.
Why does the comparison look wrong?
Best results come from comparing videos at the same resolution and aspect ratio. Videos of very different sizes are scaled to the same dimensions before comparison, which can distort the diff. Also ensure both videos are fully loaded before comparing.