# Playwright MCP server

> Automate a real browser through Playwright accessibility snapshots instead of screenshots.

- Listing: https://mcp.tc/i/playwright
- Connect: this is a local (stdio) server; install it on your machine (see Install). The listing link is a page, not an MCP endpoint.
- Type: local (stdio)
- Auth: no API key needed
- Category: [Browser Automation](https://mcp.tc/c/browser-automation)
- Vendor: Microsoft
- Verified: yes, mcp.tc checked that this is the official server (https://mcp.tc/verify). It says who runs the server, not that it is safe.
- Homepage: <https://github.com/microsoft/playwright-mcp>
- Repository: <https://github.com/microsoft/playwright-mcp>
- Package: npm `@playwright/mcp`

## About

Connects an MCP client to Playwright so an assistant can drive a browser and interact with web pages. It works from structured accessibility snapshots of the page, so no screenshots or vision models are needed.

Runs locally over stdio with npx @playwright/mcp@latest and requires Node.js 18 or newer. No account or API key is needed. It works with VS Code, Cursor, Windsurf, Claude Desktop, Claude Code, Codex, Gemini CLI, Goose and other MCP clients.

## What it can do

- Drive a browser through structured accessibility snapshots
- Interact with web pages without vision models
- Keep persistent browser state across steps
- Support exploratory automation and self-healing tests
- Install in many MCP clients with one npx command

## Example prompts

- "Open example.com and tell me what links are on the page"
- "Fill out the signup form on my local dev site and submit it"
- "Walk through the checkout flow and report any errors you see"
- "Explore this web app and list the main pages and actions"

## Install

### Claude Code

1. Run this in a terminal, in your project folder:

```bash
claude mcp add --transport stdio playwright -- npx -y @playwright/mcp
```

2. Start Claude Code and type `/mcp`. **playwright** should show as connected.

Add `--scope user` to make it available in every project.

### Claude Desktop

1. Open **Settings → Developer → Edit Config**. It opens `claude_desktop_config.json`. Add:

`claude_desktop_config.json`:

```json
{
  "mcpServers": {
    "playwright": {
      "command": "npx",
      "args": [
        "-y",
        "@playwright/mcp"
      ]
    }
  }
}
```

2. Save the file and restart Claude Desktop.

Needs Node.js on your computer. The file lives in `~/Library/Application Support/Claude/` on macOS and `%APPDATA%\Claude\` on Windows.

### Cursor

[Add to Cursor](<https://cursor.com/install-mcp?name=playwright&config=eyJjb21tYW5kIjoibnB4IiwiYXJncyI6WyIteSIsIkBwbGF5d3JpZ2h0L21jcCJdfQ%3D%3D>) (opens Cursor)

Or add it by hand to `~/.cursor/mcp.json` (all projects) or `.cursor/mcp.json` (this project):

`mcp.json`:

```json
{
  "mcpServers": {
    "playwright": {
      "command": "npx",
      "args": [
        "-y",
        "@playwright/mcp"
      ]
    }
  }
}
```

Needs Node.js on your computer.

### VS Code

[Install in VS Code](<https://vscode.dev/redirect/mcp/install?name=playwright&config=%7B%22type%22%3A%22stdio%22%2C%22command%22%3A%22npx%22%2C%22args%22%3A%5B%22-y%22%2C%22%40playwright%2Fmcp%22%5D%7D>) (opens VS Code)

Or from a terminal:

```bash
code --add-mcp '{"name":"playwright","type":"stdio","command":"npx","args":["-y","@playwright/mcp"]}'
```

Or commit it to the repo in `.vscode/mcp.json`:

`.vscode/mcp.json`:

```json
{
  "servers": {
    "playwright": {
      "type": "stdio",
      "command": "npx",
      "args": [
        "-y",
        "@playwright/mcp"
      ]
    }
  }
}
```

Needs Node.js on your computer.

### Devin Desktop

1. Add it to `~/.config/devin/mcp_config.json` (macOS and Linux) or `%APPDATA%\devin\mcp_config.json` (Windows):

`mcp_config.json`:

```json
{
  "mcpServers": {
    "playwright": {
      "command": "npx",
      "args": [
        "-y",
        "@playwright/mcp"
      ]
    }
  }
}
```

2. Refresh the MCP server list in Cascade.

Devin Desktop is the new name for Windsurf.

### Codex

```bash
codex mcp add playwright -- npx -y @playwright/mcp
```

Or edit `~/.codex/config.toml` directly:

`config.toml`:

```toml
[mcp_servers.playwright]
command = "npx"
args = ["-y", "@playwright/mcp"]
```

Needs Node.js on your computer.

### Gemini CLI

```bash
gemini mcp add playwright npx -- -y @playwright/mcp
```

This adds it to the current project. Add `-s user` to use it everywhere.

### Any client

Most clients that start local servers accept this shape:

```json
{
  "mcpServers": {
    "playwright": {
      "command": "npx",
      "args": [
        "-y",
        "@playwright/mcp"
      ]
    }
  }
}
```

Zed puts servers under `context_servers` in its settings, with the same `command`, `args` and `env` fields.

Needs Node.js on your computer.

## Details

- Server version: 1.0.0
- Last checked: 2026-10-04
- Listed: 2026-10-03
- Updated: 2026-10-04

---
Source: https://mcp.tc/i/playwright (mcp.tc is an independent directory, not affiliated with this server's publisher). Corrections: https://mcp.tc/report
