Log inSubmit server
Playguard logo

Playguard

Proxies Playwright and optional Figma, DevTools, Shopify, and Context7 MCPs through one optimized connection.

InstallRepositoryWebsite
Full README Compare alternatives Embed widget Claim this listing

Install Playguard

Pick your client, then add it in one click or paste the config.

STDIONode.js
~/Library/Application Support/Claude/claude_desktop_config.json
claude_desktop_config.json
{
  "mcpServers": {
    "playguard": {
      "command": "npx",
      "args": [
        "-y",
        "@shopify/dev-mcp@latest"
      ]
    }
  }
}

Settings → Developer → Edit Config, merge this into mcpServers, then fully quit and reopen Claude Desktop.

Automated check passed— started and listed 5 tools correctly (1d ago).

Overview

playguard MCP server combines bundled Playwright MCP with optional Figma, Chrome DevTools, Shopify Dev, and Context7 upstreams behind one MCP connection. It compacts browser and documentation responses, caches selected results, recovers crashed browser or upstream processes, and records token savings. Reach for it when an agent needs several development tools without separate client entries or when large browser snapshots are consuming context. Its own tools add an axe-core accessibility audit and a Framelink-only Figma-versus-DOM design comparison.

Use cases

  • Run browser automation, Figma, DevTools, and documentation tools through one client entry
  • Reduce token usage from large Playwright accessibility snapshots
  • Recover browser sessions after crashes without exposing the failure to the agent
  • Audit a live Playwright page for accessibility issues
  • Compare a Framelink Figma node with a live DOM element

Key features

  • Proxies Playwright and optional Figma, Chrome DevTools, Shopify Dev, and Context7 MCPs
  • Compacts, filters, and diffs browser snapshots
  • Recovers crashed browser sessions and upstream processes
  • Caches snapshots, evaluations, Figma responses, and documentation
  • Controls screenshot handling and logs token savings
  • Provides accessibility auditing and Framelink design comparison tools

Tools5

What Playguard lets your agent do. Expand a tool for its parameters.

Verified live~6.5k tokens of context

Security & health

What it can reach and how reliably it runs — from our own checks, not the maintainer’s claims.

ActiveLast checked 1d ago

Recent health check succeeded.

What it can do

From the 5 tools this server returned when we ran it.

Runs commands · 1Can delete or modify data · 3Handles credentials · 2Makes network requests · 1Read-only tools · 2
Unusual tool instructions. 1 tool description contain text aimed at the AI model rather than at you (tries to chain into other tools). Read the tool descriptions before connecting.
Network at startup3 connections
Files written at startupNone
Install scriptsNone
npm provenanceNot published
Package age599 days
Maintainers6

Observed 2026-11-09 in an isolated sandbox. A description of reach, not a security audit.

Supply-chain signal

No high-severity advisories surfaced by our automated scan.

Critical 0High 0Medium 0Low 0

Scanned 2d ago via OSV.dev · @shopify/dev-mcp@latest (npm)

Adoption & maintenance

Factual signals from GitHub, npm, and our automated checks — not a rating.

GitHub stars24Stargazers on the source repository.
npm downloads949Package downloads in the last 30 days.
Last commit2d agoMost recent push to the default branch.
Availability100%Our rolling endpoint + install checks that succeeded.
Install checkPassedOur sandbox started it and listed its tools.
Tools exposed5Callable tools this server registers over MCP.

How Playguard works

What playguard does

playguard presents several MCP backends through a single MCP server entry. Playwright MCP is bundled and always enabled; Figma, Chrome DevTools, Shopify Dev MCP, and Context7 are optional. The server routes tool calls to the selected upstream and transforms responses before returning them to the client.

The main optimization target is response size. Browser accessibility snapshots can be reduced to interactive elements and structural landmarks, returned as deltas, or limited to a named section, a subtree around an element reference, or a specified depth. Documentation responses, Figma trees, network information, and traces also have upstream-specific compaction or rewriting. Repeated results may be represented as UNCHANGED.

Two tools belong to playguard itself: playguard_a11y_audit, which runs axe-core against the Playwright page, and playguard_compare_design, which compares a Figma node with a live DOM element when Framelink Figma is enabled.

How it works

The client opens one stdio MCP connection to playguard. Playwright runs as a bundled child service, while optional upstreams are started from commands or connected through the official Figma desktop MCP URL. Each enabled upstream has its own child process or connection. A failed optional upstream removes that upstream's tools while the others continue operating.

Optional services start lazily. Their tools can be announced later through tools/list_changed, and initial tool discovery waits only for a bounded period when an upstream is slow. Browser session failures such as closed targets, closed browsers, connection refusal, or crashes trigger a Playwright restart, URL restoration, and call retry. Concurrent calls during one crash share the recovery rather than starting separate restarts.

Playwright snapshots, evaluation results, Figma responses, and documentation responses can be cached. Snapshot prefetch can run after navigation, although an intervening action or evaluation discards the prefetched result. Calls are written to an NDJSON log, and npm run analyze reports token savings by upstream.

Setup and configuration

Add a single playguard@latest entry to the MCP client's configuration and restart the client after changing its environment. Playwright requires no separate installation. Enable optional backends by setting their environment variables:

  • FIGMA_MCP_CMD and FIGMA_API_KEY for Framelink Figma, with FIGMA_MCP_ARGS used for its launch arguments.
  • FIGMA_MCP_URL for the official Figma desktop server. When both Figma modes are configured, this URL takes precedence.
  • DEVTOOLS_MCP_CMD for Chrome DevTools MCP.
  • SHOPIFY_DEV_MCP_CMD for Shopify Dev MCP.
  • CONTEXT7_MCP_CMD for Context7.

Removing an upstream variable disables that backend. The official Figma desktop option uses a local URL and requires the Figma desktop app, plus a Developer or Full seat on a paid plan. Figma's remote mcp.figma.com endpoint is not supported as a proxied backend.

Behavior can be adjusted with variables including PLAYGUARD_SCREENSHOTS, PLAYGUARD_COMPACT, PLAYGUARD_SMART_WAIT, PLAYGUARD_SMART_WAIT_MAX_RETRIES, and PLAYGUARD_PREFETCH_SNAPSHOT. Screenshot handling supports redirect, warning, blocking, or allowing calls. Smart wait is disabled by default, as it can add latency to snapshot requests; snapshot prefetch is also disabled by default.

Tools and capabilities

  • Bundled Playwright browser automation with compact, filtered, cached, and delta snapshots.
  • Recovery for dead browser sessions and crashed upstream processes.
  • Screenshot policy controls and shorter Playwright responses through disabled code-generation output.
  • Figma response optimization through Framelink, or passthrough access to the official desktop server.
  • Chrome DevTools network summaries, request trimming, snapshot compaction, trace trimming, and error hints.
  • Shopify Dev MCP and Context7 response rewriting, disk caching, repeat suppression, and compact tool listings.
  • playguard_a11y_audit and Framelink-only playguard_compare_design.

Limitations and notes

Playwright is always active, but every other upstream is optional and must be configured separately. Only one Figma mode can be used at a time. The Figma design comparison tool requires Framelink rather than the official desktop server. Changing configuration requires an MCP client restart because services are started once per client session. Compact snapshots are optimized for agent navigation; setting PLAYGUARD_COMPACT=false restores raw snapshots.

Read the full README View source on GitHub

Reviews

No reviews yet — be the first to share how it worked for you.

Frequently Asked Questions about Playguard

playguard is an MCP server that connects an agent to bundled Playwright MCP plus optional Figma, Chrome DevTools, Shopify Dev MCP, and Context7 upstreams through one connection. Its main tools include browser automation, playguard_a11y_audit, playguard_compare_design, and proxied tools from enabled upstreams.

Add a single MCP configuration entry that runs `npx -y playguard@latest`, then restart the client. Playwright MCP is bundled, while optional upstreams are enabled through environment variables such as `FIGMA_MCP_CMD`, `DEVTOOLS_MCP_CMD`, `SHOPIFY_DEV_MCP_CMD`, and `CONTEXT7_MCP_CMD`.

playguard works with Claude Code, Claude Desktop, Cursor, Codex, and other MCP-compatible agents. It uses one stdio MCP connection, with the client configuration supplying the command and optional environment variables.

Set `FIGMA_MCP_CMD` and `FIGMA_API_KEY` for Framelink Figma, or set `FIGMA_MCP_URL` for the official Figma desktop MCP server. The URL takes precedence if both modes are configured, and the remote `mcp.figma.com` server cannot be proxied.

Related MCP servers

All in Aggregators All alternatives
Add a badge to your READMEShow it’s listed — live SVG, Markdown or HTML.

AllMCPs Directory Badge

Full Badge Customizer

Showcase your server listing on GitHub or your project documentation. Embed this dynamic SVG badge to highlight official listing status and live engagement.

Badge Style:
Live Dynamic SVG PreviewPlayguard AllMCPs Directory Badge
Markdown (GitHub README)
[![AllMCPs](https://allmcps.com/api/badge/playguard?style=directory)](https://allmcps.com/mcp/playguard)
HTML Embed
<a href="https://allmcps.com/mcp/playguard"><img src="https://allmcps.com/api/badge/playguard?style=directory" alt="Playguard on AllMCPs" /></a>