Visual Diff API

See exactly what
changed.

Compare two screenshots pixel-by-pixel. Get a diff percentage, pixel count, and a visual diff image highlighting exactly what changed. Built for deployment verification, visual regression testing, and A/B testing.

Start free → View Docs

Use cases

🚀

Deployment verification

Screenshot before and after a deploy. Catch unintended visual regressions before users do.

🧪

A/B testing

Compare two variants of a page visually. Quantify the visual difference between versions.

📊

Visual regression testing

Integrate into your CI/CD pipeline. Fail builds when visual changes exceed a threshold.

🔍

Content monitoring

Track changes on competitor pages, news sites, or any URL over time.

How it works

Two screenshots. One diff.

Take two screenshots with the Screenshot API, then pass their IDs to the Diff API. Results are cached — the same pair won't be recomputed.

Pixel-level comparison using pixelmatch algorithm
Configurable threshold (0.0 – 1.0)
Returns diff percentage and pixel count
Visual diff image (base64 PNG) highlighting changes
Results cached in DB — same pair returns instantly
Handles different image sizes via auto-crop

POST /api/v1/diff

curl -X POST 'https://goscreenapi.com/api/v1/diff' \
  -H 'Authorization: Bearer YOUR_KEY' \
  -H 'Content-Type: application/json' \
  -d '{
    "request_id_1": "uuid-before-deploy",
    "request_id_2": "uuid-after-deploy",
    "threshold": 0.1
  }'

200 OK

{
  "status": "success",
  "diff_id": 42,
  "cached": false,
  "diff_percentage": 3.47,
  "diff_pixels": 12840,
  "compared_size": "1280x900",
  "threshold": 0.1,
  "diff_image": "data:image/png;base64,..."
}

Start comparing

250 free screenshots/month. No credit card required.

Start free → API Docs

Understanding the Visual Diff API

The visual diff API offers an advanced pixel-by-pixel comparison, essential for CI/CD visual regression testing. This API meticulously highlights changed areas in images, overlaying them with red for clarity. It reports the percentage of pixels changed alongside precise bounding boxes of these changes.

Developers need quick feedback. The API responds in under 200 milliseconds for images up to 5 MB. It supports widely-used formats like PNG, JPEG, and BMP. Configuration options include threshold settings to ignore anti-aliasing, streamlining the diff process significantly.

Technical Specifications

What makes this tool effective? Specifically, it’s the detailed reporting and versatility. The visual diff API not only checks for changes but provides detailed metrics. These metrics include the percentage change between images and bounding boxes of altered regions.

Request limits accommodate up to 100 image comparisons per minute. As a result, it fits seamlessly into high-frequency CI/CD pipelines. The flexibility of configurable thresholds ensures that minor visual noise doesn't trigger alerts, which can prevent unnecessary disruptions.

Real-world Use Cases

Pixel Diff for UI testing: Detect even the smallest pixel shifts in new UI deployments.
Automated screenshot comparison in CI/CD: Ensure new commits don't introduce unintended visual changes.
Website change detection: Monitor and highlight any unauthorized content changes.
Visual regression analysis: Quickly identify and address regressions before they reach production.
Before after diff for A/B tests: Clarify visual changes between test variants.

Implementation Details

Integrating the visual diff API into your workflow requires minimal setup. Developers can initiate requests using standard HTTP POST methods. Each request should include the base and comparison images in supported formats. Responses provide a diff image with red highlights and a JSON report detailing changes.

The API's efficiency lies in its lightweight construction. With a low memory footprint, it operates effectively within resource-constrained environments. Debugging visual changes in staging environments becomes straightforward with this tool.

Final Thoughts

The visual diff API is your go-to solution for precise image comparison in automated testing setups. Adopt this API to ensure no unexpected visual changes disrupt your web applications.

Frequently Asked Questions

What is a visual diff API and how does it work?

A visual diff API compares two images to identify differences at the pixel level. It generates a diff image highlighting the changes, allowing for quick identification of visual discrepancies during development or testing.

How can I perform pixel comparison using your API?

To perform pixel comparison, you can upload two images in PNG or JPEG format via our API. The response includes a diff image and a JSON object detailing the pixel differences, with response times typically under 200 milliseconds.

What is change detection and how does it benefit my project?

Change detection identifies alterations between versions of images, enabling teams to track visual modifications. This feature is crucial for maintaining design consistency and ensuring that updates do not unintentionally affect the user interface.

How do I implement visual regression testing with your service?

Visual regression testing can be implemented by integrating our API into your CI/CD pipeline. You can automate screenshot captures and comparisons, ensuring that any visual changes are detected before deployment, thereby improving overall quality assurance.

See exactly what changed.