Visual diffs built for real UI review

Honeydiff is the Rust diff engine inside Vizzly. It's fast, it filters out noise, and it tells you where things changed.

Install Node package View GitHub repo

Diff Drizzle, the Honeydiff mascot holding a magnifying glass over visual diff pixels

See it on a real screenshot

Here's one of our own inbox screenshots. Flip between the views to see what changed and what each engine catches.

Baseline Current Honeydiff odiff

Baseline screenshot of the Vizzly inbox — The approved screenshot.

Current screenshot of the Vizzly inbox, with the Mentions tab highlighted — The new run. The Mentions tab picked up a background, and the project IDs changed.

Honeydiff diff output with the Mentions tab and project IDs marked in red — 11,914 pixels flagged, including the Mentions tab.

odiff diff output with only the project IDs marked in red — odiff 4.1.1 flags 702 pixels. Its anti-aliasing filter drops the Mentions tab change.

Built in-house

We wrote the engine that runs local TDD, cloud baselines, PR checks, and agent context. So when it needs to get faster or smarter, we just do it.

Full HD default ~18.9ms

CIEDE2000 + AA filtering

4K default ~77.7ms

CIEDE2000 + AA filtering

Tall exact path ~4.9ms

threshold 0, no AA, no cluster filter

More than a pixel count

Honeydiff tells you where the image changed and how big each change is.

Perceptual by default

CIEDE2000 thresholds. Exact mode when you need it.

thresholdperceptualScore

Noise-aware

AA detection, cluster sizing, and text-region merging.

antialiasingminClusterSizeclusterMerge

Region metadata

Bounds, clusters, pixel counts, intensity stats.

includeClustersboundingBoxintensityStats

Structural metrics

SSIM and GMSD for similarity beyond changed pixels.

includeSSIMincludeGMSDperceptualScoregmsdScore

Accessibility checks

WCAG contrast analysis and color vision simulation.

analyzeWcagContrastsimulateColorBlindnesscontrastRatio

Artifacts plus JSON

Diff, mask, overlay, JSON, scores, fingerprints.

diffPathmaskPathoverlayPathfingerprint

Use Honeydiff directly

Install @vizzly-testing/honeydiff and call it from Node, or build the CLI from the repo for quick local checks.

$ npm install @vizzly-testing/honeydiff

import { compare } from '@vizzly-testing/honeydiff';

let result = await compare('baseline.png', 'current.png', {
  threshold: 2.0,
  includeClusters: true,
  includeSSIM: true,
  includeGMSD: true,
  diffPath: 'artifacts/diff.png',
  maskPath: 'artifacts/mask.png',
  overlayPath: 'artifacts/overlay.png',
  overwrite: true
});

console.log(result.diffPercentage);
console.log(result.aaPixelsIgnored);
console.log(result.perceptualScore);
console.log(result.diffClusters?.length ?? 0);

Use it on its own or inside Vizzly

Honeydiff is great when you just need to compare images. Vizzly adds approved baselines, local TDD, PR checks, and team review on top.

Open npm package Try Vizzly