Every change, diffed. Pixels or any file.
Visual regression testing for Playwright, Storybook, Vitest and Cypress: deterministic pixel diffs for screenshots, text diffs for Markdown, JSON, YAML, HTML and ARIA snapshots. Every snapshot is compared to the baseline Argos picks from your Git history, and every diff is structured data your agents can read.
Only the real changes
The SDKs capture the same page the same way on every run, and Argos compares each screenshot to its baseline pixel by pixel. What reaches review is a change, not rendering noise.
Deterministic capture
Before the screenshot, the SDK waits for fonts, images and aria-busy to settle, hides carets and scrollbars, pauses GIFs on their first frame and pins sticky elements in place. Same page, same pixels, in every run.
A mask and a score, not a guess
Each comparison normalizes both images, runs several diff passes at different thresholds, clusters pixels to separate noise from change, and outputs a diff mask and a score. The engine is the open-source odiff library; the implementation is public too.
A threshold you set
threshold runs from 0 to 1, default 0.5: the higher, the less sensitive the comparison. Set it per screenshot in the SDK or per upload with --threshold.
Mask what you can't control
data-visual-test="transparent" hides a date or an avatar and keeps its space, blackout masks it, removed drops it from the layout.
Open source, no black box
Same input, same result, and the exact pixels that changed are visible. No model decides what counts, and nothing hides a small change.
Learn moreNot just screenshots
Upload text files with the CLI and Argos matches each one to its baseline like a screenshot, then diffs it as text. The Markdown an agent wrote, a JSON fixture, generated HTML: reviewed next to your visual diffs.
Text diffs for structured output
argos upload -f "**/*.{txt,json,yaml,yml,xml,html,md,css,js}" ./snapshots uploads plain text, JSON, YAML, XML, HTML, Markdown, CSS and JavaScript. Keep file names stable and each one gets a baseline of its own.
ARIA snapshots, diffed like code
Pass ariaSnapshot: true to argosScreenshot, or call argosAriaSnapshot, and the Playwright SDK captures the page's accessibility tree next to the screenshot. A renamed heading or a lost landmark shows up as a text diff even when the pixels don't move.
Snapshot any value from Vitest
argosSnapshot(value, { extension: ".json" }) serializes any value in a browser or Node test and diffs it across builds. No browser needed.
Same build as your screenshots
Pass both globs to one argos upload and images and text files land in the same build, the same review and the same check.
One file, one screenshot
Every snapshot in a build counts as one screenshot toward your plan, image or not, and each is limited to 50 MB.
Learn moreEvery story, every mode, in your CI
Argos captures your stories in your own CI with Playwright, through Vitest or the Test Runner. Each story becomes a snapshot with a baseline of its own, and each mode multiplies it.
Stories in StorybookEvery story is captured and compared to its own baseline, so a component regression is caught where it lives, not three pages later.
Learn moreDeclare parameters.argos.modes for theme, viewport or locale, and Argos captures one snapshot per mode name, each with its own baseline, without duplicating stories.
Learn moreScreenshots are taken where your code runs, by the Vitest browser mode you already use. Nothing is rendered in a third-party cloud.
Learn moreScreenshots inside play functions
The play function runs before the capture. With Vitest, call argosScreenshot(ctx, name) inside it to capture a form before and after it is filled.
Fit to content
Snapshots are cropped to the rendered component by default, with 16px of padding at 2x zoom. Set fitToContent: false to capture the whole page.
Vitest, Test Runner, or legacy Storybook
Storybook's Vitest addon is the recommended path. The Test Runner and Storybook before v8 are supported too, each with its own quickstart.
Learn moreYour tests, your CI, one baseline
Playwright, Vitest, Cypress, WebdriverIO, Puppeteer, or any tool that writes a screenshot to disk. Upload from any CI, Argos picks the baseline from your Git history, and every diff lands on the pull request as a check.
Screenshots stay in CI, not in Git
The reporter uploads what your tests captured, straight from the CI job. No binary files committed, no baseline folder to maintain, no local run to refresh it.
Every snapshot carries its context
URL, viewport, color scheme, browser, test title and location, retry, tags: the SDKs attach it all as metadata. It shows on the build page and in the CLI's JSON, so a reviewer or an agent knows what they are looking at.
The right baseline, from Git
Argos compares against the latest approved build on the commit your branch started from: the merge base with the base branch. Auto-approved branches like main keep the baseline current without a review.
Shards in, one build out
Playwright shards join one build automatically, Vitest shards with a shared ARGOS_PARALLEL_NONCE. Elsewhere,ARGOS_PARALLEL and the nonce do it. One comparison, one status per commit.
Any framework via the CLI
argos upload ./screenshots creates a build from any folder of images. The CLI reads the commit, branch and pull request from your CI environment.
Diffs your agent can read
Every diff is structured data: status, score, diff mask URL, baseline and current files, and the metadata the SDK attached. An agent uploads from the CLI, reads the build back as JSON, and uses the diff as evidence before it approves anything.
argos upload ./screenshots
argos upload ./snapshots \
-f "**/*.{txt,json,yaml,yml,xml,html,md,css,js}"
argos build get <build>
argos build snapshots <build> --needs-review --jsonRead-only with the CI token
build get and build snapshots work with the project token your CI already has. --needs-review --json returns only the diffs awaiting a decision.
Inspect diffs from your editor
Connect Claude Code, Cursor or Copilot to mcp.argos-ci.com and the agent lists builds and inspects their screenshot diffs, with the projects:read scope and nothing more.
Skills that know the diff
npx skills add https://argos-ci.com installs argos-pr-review, which inspects snapshots as evidence for a review, and argos-cli, which teaches the commands.
“A lot of what we test isn't a screenshot at all. Argos diffs our rendered output and the text behind it against a baseline, so we catch changes in structure, not just pixels.”
Frequently asked questions
Does Argos use AI to decide whether something changed?
No. Argos compares each snapshot to its baseline with deterministic pixel diffing, built on the open-source odiff library. Each comparison normalizes both images, runs several diff passes at different thresholds, clusters pixels to separate noise from real change, and outputs a diff mask and a score. Same input, same result, and the exact pixels that changed are visible. The diff implementation is public too.
Agents can read the result as evidence when they review a build, but no model decides what counts as a change.
What can Argos diff besides screenshots?
Text files, uploaded with the CLI: argos upload -f "**/*.{txt,json,yaml,yml,xml,html,md,css,js}" ./snapshots. Supported content types are plain text, JSON, YAML, XML, HTML, Markdown, CSS and JavaScript; each file is matched to its baseline by name and diffed as text. The Playwright SDK also captures ARIA snapshots of the accessibility tree, and the Vitest SDK snapshots any serializable value with argosSnapshot. Every snapshot in a build counts as one screenshot toward your plan.
What is a snapshot compared against?
The baseline build: the most recent complete, approved build with the same build name and mode whose commit is an ancestor of the merge base between your branch and its base branch. For a pull request the base branch is the PR's; for a push it is the project's default baseline branch. Builds on auto-approved branches such as main serve as baselines without a manual review, and a build with an active rejection never does. Until a build exists on your baseline branch, pull request builds are orphans with nothing to compare against. Set ARGOS_REFERENCE_BRANCH or ARGOS_REFERENCE_COMMIT to pin a different baseline.
How do I keep diffs from flaking?
Most flakes are removed before the capture: by default the SDKs wait for fonts, images and aria-busy elements, hide carets and scrollbars, pause animated GIFs on their first frame and pin sticky elements in place. For anything you can't control at the source, such as dates, avatars or ads, mark the element with data-visual-test="transparent" or "blackout", and raise threshold (0 to 1, default 0.5) when a screenshot needs a looser comparison. When a change keeps recurring anyway, Argos Stabilize scores the test's flakiness and lets you ignore that specific change without hiding new regressions.
Which test frameworks does Argos support?
Official SDKs cover Playwright, Vitest, Storybook (Vitest, Test Runner, or Storybook before v8), Cypress, WebdriverIO and Puppeteer. Anything else that writes screenshots to a folder works through the CLI: argos upload ./screenshots creates the build and reads the commit, branch and pull request from your CI environment. Text-file diffs go through the CLI as well.
One platform, from pull request to merge
A diff is the middle of the flow: deploy the pull request first, review what changed next, and stabilize the tests behind it.
Supercharge your product quality
See every change your team and your agents make. Review with confidence, and merge faster.