Snapdiff

ai.snapdiff由 snapdiff.ai 發布v0.5.0更新於 Nov 10, 2026

Visual-diff & change-detection tools that catch agentic UI drift for coding agents.

概覽

AI 產生的概覽

讓程式開發助理透過 SnapDiff API 擷取網頁截圖、進行視覺差異比對,並對照基準驗證 UI 變更。

可以做什麼
提供四個工具:對照宣告的意圖驗證 UI 變更並回傳判定結果與下一步動作;比對兩個頁面或頁面與已儲存的基準,給出差異百分比與高亮差異圖;擷取任意 URL 的截圖;將 HTML/CSS 轉譯為圖片。它會呼叫 SnapDiff REST API,並以 stdio 子程序在本機執行,因此以 Playwright 為基礎的本機工具會在你的電腦上執行。託管端點也提供相同的工具集。
適用情境
適合程式開發助理需要確認某次 UI 修改產生預期的視覺變化且沒有回歸時使用,也適合在不離開助理的情況下做臨時頁面差異比對、截圖或產生 OG 卡片等圖片。
執行需求
需要 Node.js 與 npx 在本機執行這個 npm 套件;需要 SnapDiff API 金鑰,透過環境變數 SNAPDIFF_API_KEY 提供;需要連線至 SnapDiff API 的網路。選用環境變數 SNAPDIFF_API_URL 可覆寫 API 位址。
安裝前請注意
需要 SnapDiff API 金鑰,這是與計費帳戶綁定的憑證,請勿寫入共用設定檔。伺服器會將你提交的 URL 與 HTML 傳送至 SnapDiff API,請避免提交不希望離開本機的內容。驗證功能依賴已設定的專案與基準。

安裝

在 SourceWeft 中

  1. 開啟 儀表板中的 Snapdiff,將其新增到工作區。
  2. 為需要使用其工具的對話啟用該服務。

Desktop only,透過 STDIO。 STDIO 服務會啟動本機處理程序,因此需要 SourceWeft 桌面主機。

其他 MCP 客戶端

參照 儲存庫 中的啟動說明。

README

@corralimited/snapdiff-mcp

Standalone MCP server for SnapDiff. Exposes four tools to local agents:

  • Compare two web pages visually — diff percentage plus a highlighted diff image
  • Capture a screenshot of any URL
  • Check whether a page changed vs. a previous capture
  • Render HTML/CSS to an image (OG cards, social images, email headers)

Hits the public SnapDiff REST API. Bring your own API key.


Quickstart

Get an API key at https://snapdiff.ai/dashboard, then drop the snippet for your agent below.

Claude Code

bash
claude mcp add snapdiff -e SNAPDIFF_API_KEY=sk_live_... -- npx -y @corralimited/snapdiff-mcp

Or edit ~/.claude/settings.json:

json
{  "mcpServers": {    "snapdiff": {      "command": "npx",      "args": ["-y", "@corralimited/snapdiff-mcp"],      "env": { "SNAPDIFF_API_KEY": "sk_live_..." }    }  }}

Cursor

~/.cursor/mcp.json (or project-level .cursor/mcp.json):

json
{  "mcpServers": {    "snapdiff": {      "command": "npx",      "args": ["-y", "@corralimited/snapdiff-mcp"],      "env": { "SNAPDIFF_API_KEY": "sk_live_..." }    }  }}

Cline (VS Code)

Cline > MCP Servers > Edit Config:

json
{  "mcpServers": {    "snapdiff": {      "command": "npx",      "args": ["-y", "@corralimited/snapdiff-mcp"],      "env": { "SNAPDIFF_API_KEY": "sk_live_..." }    }  }}

Zed

~/.config/zed/settings.json:

json
{  "context_servers": {    "snapdiff": {      "command": {        "path": "npx",        "args": ["-y", "@corralimited/snapdiff-mcp"],        "env": { "SNAPDIFF_API_KEY": "sk_live_..." }      }    }  }}

Continue

~/.continue/config.yaml:

yaml
mcpServers:  - name: snapdiff    command: npx    args: ["-y", "@corralimited/snapdiff-mcp"]    env:      SNAPDIFF_API_KEY: sk_live_...

Anything else with a generic stdio MCP slot

command: npxargs:    -y @corralimited/snapdiff-mcpenv:     SNAPDIFF_API_KEY=sk_live_...

Tools

NamePurpose
snapdiff_verify_ui_changeChecks whether a visual change matches the agent's stated intent. Returns verdict (pass / expected_change_detected / unexpected_regression / no_change_detected / needs_human_review) and a next_action. Requires a project + baseline. Use this in the verification loop.
snapdiff_compare_pagesRaw visual diff between two URLs, or a URL vs. a stored project baseline. Use for ad-hoc diffs that don't fit the verify-ui-change verdict shape.
snapdiff_capture_screenshotSingle screenshot of a URL.
snapdiff_html_to_imageRender HTML/CSS to an image (OG cards, social images, email headers).

Schemas live in src/tools/ and are exported from @corralimited/snapdiff-mcp/tools. The hosted SnapDiff backend imports the same schemas so its in-process /mcp endpoint and this standalone stdio server expose an identical surface — agents see the same tool names, descriptions, and parameters whether they connect to https://api.snapdiff.ai/mcp or run this server locally.


Remote HTTP access

This package speaks stdio only — your editor spawns it as a subprocess, and the Playwright-backed localhost tools run on your machine, where your dev server actually is. It does not open a port.

If you need an HTTP endpoint, use the hosted one at https://mcp.snapdiff.ai/mcp, which authenticates every request with your API key and exposes the same tool surface.


Configuration

Env varRequiredNotes
SNAPDIFF_API_KEYyesGet one at https://snapdiff.ai/dashboard
SNAPDIFF_API_URLnoOverride the API base. Defaults to https://api.snapdiff.ai/v1.

There are no CLI flags beyond --help.


License

MIT — see LICENSE.

來源:README.md,提交 e420175

工具

0
SourceWeft 尚未在沙箱中啟動過該軟體包,因此其工具未知。

版本歷史

1
  1. v0.5.0最新Sep 16, 2026

評分

已滿足適用檢查項的 50%

該評分衡量此收錄條目的完整程度,依據註冊中心條目、端點與公開來源計算得出。它不是對伺服器本身的評價,也不表示伺服器安全或目前可用:可連通性是帶日期的檢查結果,評分也不包含安裝量或使用者評價。

  • 近 30 天內可連通25 分

    請保持端點能夠回應 MCP 握手;SourceWeft 每 30 天探測一次。

  • 已宣告認證方式10 分

    請在註冊中心條目中宣告憑證請求標頭,或保持端點能夠回應探測,以便判定其認證方式。

  • 已列出工具15 分

    請讓伺服器在無憑證時回應 tools/list,或發布可在沙箱中無憑證啟動的軟體包。

  • 描述必需15 分
  • 圖示10 分
  • 文件15 分
  • 授權條款10 分