argent-screenshot-diff Skill for Claude: Compare App Screenshots Before and After

Has Claude use Argent's screenshot-diff tool to compare a baseline screenshot of your app with the current screen and flag visual changes.

Installs: 26.6K; on skills.sh
Stars: 3.1K; on GitHub
Updated: Oct 2026; last repo commit

This skill tells Claude how to run a visual regression check with Argent's screenshot-diff tool. Claude saves a full-size baseline PNG, makes the change or reaches the screen under test, then compares the baseline with a live capture or a second saved file. It reports the diff as supporting evidence, not as proof by itself.

It only works with the Argent tooling, which gives an assistant control of simulators, emulators and devices. The Argent README sets that up with an init command. The skill says to ask for a pixel diff when you request a visual regression test or a before and after comparison, and not to use it to find tap targets.

Good for

Mobile developers checking that a UI change did not shift layout, spacing, color or text elsewhere
QA engineers who want before and after screenshot comparisons as evidence
React Native teams already using Argent to drive iOS simulators, Android emulators or devices

Install argent-screenshot-diff

Claude Code

Copy this prompt.

Install the argent-screenshot-diff skill in Claude Code. Run this command:

npx @swmansion/argent@latest init

Then check that it loaded and tell me how to use it.

2
Paste it into Claude Code. It shows the change and asks before running it.

Requires Node.js 20.12 or later, macOS with Xcode for iOS.

This skill only works with the Argent tools, so install Argent, not the skill folder alone. The wizard installs @swmansion/argent globally, registers the Argent MCP server in your editor (Claude Code is on the supported list) and copies Argent skills, rules and agent definitions into your workspace. Use --local to add it to the project devDependencies instead. In a pnpm project, run pnpm dlx @swmansion/argent@latest init.

From the vendor's docs. Source.

What's in the skill

When it loads

Compare saved or live app screenshots with the argent screenshot-diff tool. Use when testing visual regressions, before/after UI comparisons, screenshot diff checks, visible layout, spacing, color, typography, clipping, overflow, text rendering, or image/icon rendering changes.

Sections in SKILL.md

1. Role
2. When To Use
3. Capture Rules
4. Parameters
5. Deterministic Flow

Key facts

Author: Software Mansion (Argent)
License: Argent source is Apache-2.0; its proprietary binaries are licensed only for use within the project
Needs: The Argent tools (screenshot, screenshot-diff) and a device ID (udid)
Argent setup in README: npx @swmansion/argent@latest init
What installs: This skill is 1 file, SKILL.md. The Argent init wizard also copies the other Argent skills, rules and agent definitions.
Installs on skills.sh: 26,559 (Nov 2, 2026)
GitHub stars: 3,138 (Nov 2, 2026)
Last commit: 2026-10-31
skills.sh audits: Gen Agent Trust Hub pass, Socket pass, Snyk pass

What it includes

Compares a baseline with a current screenshot and writes diff files
Takes a baseline and a current image, each either a saved path or a live capture, plus a device ID and an output folder. It supports physical iPhones for saved and live diffs.
Try: “Run a visual regression test on the settings screen against /tmp/baseline.png”
Write · screenshot-diff
Saves a full-size PNG without loading it into the chat
Uses scale 1.0 and includeImageInContext false so the large image is saved but not added to the conversation.
Write · Baseline capture
Saved baseline plus live current is the usual flow
Other options are two saved files, or a live baseline with a saved current. A live baseline and live current together are not allowed.
Input combinations
Pixel-visible changes only: layout, spacing, color, text, icons, clipping
It is a poor fit when the proof is structural, such as navigation or accessibility tree contents, or when animation or random data makes the screens noisy.
When to use it
Go to a known state, capture, change, diff, then check by eye
Five steps ending with combining the diff with normal visual inspection and other runtime evidence.
Deterministic flow

From the official docs

Permissions

Low risk

What it can do

Read your data
Create and change things
Delete things
Read-only mode

Watch out for

Screenshots can capture private data
Full-resolution images of a device screen go to a folder such as /tmp. Use test accounts and clean up the folder. github.com
Argent has telemetry and closed binaries
The Argent README says telemetry is opt-out with `argent telemetry disable` and that some binaries are proprietary. Read it before you set Argent up. github.com
The init wizard changes your setup
It installs a global npm package, registers an MCP server and writes skills, rules and agent files into the workspace. Commit or review those files before you share the repo. github.com

Technical details

Sign-in and keys	SKILL.md describes no sign-in or key.
Scopes	Argent MCP tools (screenshot, screenshot-diff) against a simulator or device Writes baseline, current and diff images to the output folder you name `argent init` installs @swmansion/argent globally, edits your editor MCP config and copies skills, rules and agents into your workspace

Questions

What does argent-screenshot-diff do?

It teaches Claude to compare a baseline screenshot of your app with the current screen using Argent's screenshot-diff tool. The result shows what changed in layout, spacing, color, text or images.

How do I install it?

Install Argent, which brings the skill with it: run npx @swmansion/argent@latest init (Node.js 20.12 or later; iOS needs macOS with Xcode). The installation docs say the wizard installs the package globally, registers the MCP server in your editor and copies skills, rules and agent definitions into your workspace. Copying only this skill folder gives you instructions without the tools.

Does it work with Android or only iOS?

This SKILL.md only describes iPhones. It names physical iPhones, with live capture on hardware at full resolution, and says nothing about Android. Argent itself lists Android emulators and devices in its README.

Can it find where to tap?

No. The skill says not to use screenshot diffs for tap targets. Use the describe, debugger-component-tree or native-describe-screen tools first.

When should I not use it?

When the check is about state, navigation or the accessibility tree, or when animations, timestamps, ads or random data make the screens differ every time.

Is it safe?

The skill is plain instructions that call Argent's tools. Those tools capture your simulator or device screen and save PNGs to the output folder, so use test data and keep the folder private.

Does the diff prove a bug?

Not alone. The skill calls the diff supporting evidence, to be combined with visual inspection, component state, logs and app behavior.

Which assistants does it work in?

SKILL.md names no client. Argent's editors page lists Claude Code, Cursor, VS Code, Zed, Gemini CLI, Codex CLI, opencode and others for the MCP server that argent init configures. We have not tested any of them.

Information

updated Nov 2, 2026

Repository: software-mansion/argent
Folder: packages/skills/skills/argent-screenshot-diff

software-mansion/argent skills.sh

Sources

Docs, issue trackers and discussions this page is built from.

Show all 5

github.com · github.com
github.com · github.com
github.com · github.com
skills.sh · skills.sh
github.com · github.com