Skip to content

Welcome to Vizzly

Vizzly compares screenshots to catch visual changes in your UI. You bring your own screenshots from tests, design tools, or manual captures. Vizzly compares them against baselines and shows you what changed.

Vizzly Project Dashboard

How it works

  1. Capture screenshots - Use SDK calls in your tests or upload via CLI
  2. Comparison - Vizzly compares each screenshot against its baseline
  3. Review - See side-by-side comparisons with diff highlights
  4. Approve or reject - Comment and approve builds as a team
  5. CI/CD integration - Get status checks in pull requests

What you can do

  • Baseline Management - Git mode tracks baselines automatically, or pick them manually
  • Team Review - Comment on comparisons and approve builds before merging
  • Local Development - Test visual changes during development without pushing to CI
  • Flexible Integration - CLI and SDK work with Playwright, Cypress, or any test framework
  • AI Workflows - MCP HTTP endpoint lets AI assistants analyze builds and debug regressions

Quick starts

Upload screenshots

Already have screenshots? Upload them:

Terminal window
npx vizzly upload ./screenshots --build-name "First test"

Add to your tests

Integrate with your existing test suite:

await vizzlyScreenshot('homepage', image, {
browser: 'chrome',
viewport: '1280x800'
});

Follow the guide

Quick Start Guide walks through setup with examples.

Documentation

When to use visual testing

Visual testing catches issues that traditional tests miss:

  • Layout shifts from CSS changes
  • Cross-browser rendering differences
  • Design inconsistencies across components
  • Unintended changes from dependency updates

It’s particularly useful for component libraries, e-commerce sites, and design-heavy applications.