Does this server require vision or screenshot-based models?

No, it operates purely on Playwright's structured accessibility tree, avoiding the need for vision models or screenshots.

Which Node.js version is required to run this server?

Node.js version 18 or newer is required.

Which MCP clients are compatible with this server?

It is compatible with VS Code, Cursor, Windsurf, Claude Desktop, Goose, Grok, Junie, and other MCP clients.

How do I install the Playwright MCP server?

Install by running 'npx @playwright/mcp@latest' as the MCP server command.

Playwright MCP

browser-automationplaywrightaccessibilitymcpllm-integration

MCP server providing browser automation via Playwright using structured accessibility snapshots for LLM interaction.

Quick Install

Automated & IDE Setup

Copy the AI prompt to install this server into Claude Code, Cursor, or another agent — or use 1-click editor setup below.

Add to Cursor Add to VS Code

Not yet automatically verified

We haven't yet run this listing's install command through our automated sandbox check. This isn't a red flag — we're steadily working through the catalog.

Manual Client & Custom JSON ConfigExpand JSON ▾

Client Config & Setup

Choose your client or environment

Target File:~/Library/Application Support/Claude/claude_desktop_config.json

claude_desktop_config.json

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

💡 Paste the JSON block into your client's configuration file under mcpServers, then restart the application.

Overview

This MCP server enables large language models to automate and interact with web pages using Playwright's accessibility tree rather than pixel-based screenshots. It supports persistent browser state and detailed page introspection, making it suitable for exploratory automation, self-healing tests, and long-running workflows. It is optimized for LLMs that require structured data input without vision models.

Use cases

Automate web interactions using structured accessibility data

Perform exploratory browser automation with persistent state

Develop self-healing web tests with iterative page reasoning

Build long-running autonomous workflows involving web pages

Integrate browser control into LLM-powered agents

Key features

Uses Playwright accessibility tree instead of screenshots

LLM-friendly structured data interface

Supports persistent browser context and introspection

Deterministic tool application avoiding visual ambiguity

Compatible with multiple MCP clients

Capabilities & Tool Schemas

Inspect callable tools, capabilities, and parameters exposed to AI agents by Playwright MCP.

Extracted Tool Capabilities

Uses Playwright accessibility tree instead of screenshots

LLM-friendly structured data interface

Supports persistent browser context and introspection

Deterministic tool application avoiding visual ambiguity

Compatible with multiple MCP clients

Documentation Overview

Playwright MCP

A Model Context Protocol (MCP) server that provides browser automation capabilities using Playwright. This server enables LLMs to interact with web pages through structured accessibility snapshots, bypassing the need for screenshots or visually-tuned models.

Playwright MCP vs Playwright CLI

This package provides MCP interface into Playwright. If you are using a coding agent, you might benefit from using the CLI+SKILLS instead.

CLI: Modern coding agents increasingly favor CLI–based workflows exposed as SKILLs over MCP because CLI invocations are more token-efficient: they avoid loading large tool schemas and verbose accessibility trees into the model context, allowing agents to act through concise, purpose-built commands. This makes CLI + SKILLs better suited for high-throughput coding agents that must balance browser automation with large codebases, tests, and reasoning within limited context windows.
Learn more about Playwright CLI with SKILLS.
MCP: MCP remains relevant for specialized agentic loops that benefit from persistent state, rich introspection, and iterative reasoning over page structure, such as exploratory automation, self-healing tests, or long-running autonomous workflows where maintaining continuous browser context outweighs token cost concerns.

Key Features

Fast and lightweight. Uses Playwright's accessibility tree, not pixel-based input.
LLM-friendly. No vision models needed, operates purely on structured data.
Deterministic tool application. Avoids ambiguity common with screenshot-based approaches.

Requirements

Node.js 18 or newer
VS Code, Cursor, Windsurf, Claude Desktop, Goose, Grok, Junie or any other MCP client

Getting started

First, install the Playwright MCP server with your client.

Standard config works in most of the tools:

JSON Config

{
  "mcpServers": {
    "playwright": {
      "command": "npx",
      "args": [
        "@playwright/mcp@latest"
      ]
    }
  }
}

Amp

Add via the Amp VS Code extension settings screen or by updating your settings.json file:

json

"amp.mcpServers": {
  "playwright": {
    "command": "npx",
    "args": [
      "@playwright/mcp@latest"
    ]
  }
}

Amp CLI Setup:

Add via the amp mcp add command below

bash

amp mcp add playwright -- npx @playwright/mcp@latest

Antigravity

Add via the Antigravity settings or by updating your configuration file:

config.json

{
  "mcpServers": {
    "playwright": {
      "command": "npx",
      "args": [
        "@playwright/mcp@latest"
      ]
    }
  }
}

Claude Code

Use the Claude Code CLI to add the Playwright MCP server:

Terminal

claude mcp add playwright npx @playwright/mcp@latest

Claude Desktop

Follow the MCP install guide, use the standard config above.

Cline

Follow the instruction in the section Configuring MCP Servers

Example: Local Setup

Add the following to your cline_mcp_settings.json file:

config.json

{
  "mcpServers": {
    "playwright": {
      "type": "stdio",
      "command": "npx",
      "timeout": 30,
      "args": [
        "-y",
        "@playwright/mcp@latest"
      ],
      "disabled": false
    }
  }
}

Codex

Use the Codex CLI to add the Playwright MCP server:

bash

codex mcp add playwright npx "@playwright/mcp@latest"

Alternatively, create or edit the configuration file ~/.codex/config.toml and add:

toml

[mcp_servers.playwright]
command = "npx"
args = ["@playwright/mcp@latest"]

For more information, see the Codex MCP documentation.

Copilot

Use the Copilot CLI to interactively add the Playwright MCP server:

bash

/mcp add

Alternatively, create or edit the configuration file ~/.copilot/mcp-config.json and add:

config.json

{
  "mcpServers": {
    "playwright": {
      "type": "local",
      "command": "npx",
      "tools": [
        "*"
      ],
      "args": [
        "@playwright/mcp@latest"
      ]
    }
  }
}

For more information, see the Copilot CLI documentation.

Cursor

Click the button to install:

Or install manually:

Go to Cursor Settings -> MCP -> Add new MCP Server. Name to your liking, use command type with the command npx @playwright/mcp@latest. You can also verify config or add command like arguments via clicking Edit.

Factory

Use the Factory CLI to add the Playwright MCP server:

bash

droid mcp add playwright "npx @playwright/mcp@latest"

Alternatively, type /mcp within Factory droid to open an interactive UI for managing MCP servers.

For more information, see the Factory MCP documentation.

Gemini CLI

Follow the MCP install guide, use the standard config above.

Goose

Click the button to install:

Or install manually:

Go to Advanced settings -> Extensions -> Add custom extension. Name to your liking, use type STDIO, and set the command to npx @playwright/mcp. Click "Add Extension".

Grok

Use the Grok CLI to add the Playwright MCP server:

bash

grok mcp add playwright -- npx @playwright/mcp@latest

Alternatively, create or edit the configuration file ~/.grok/config.toml and add:

toml

[mcp_servers.playwright]
command = "npx"
args = ["@playwright/mcp@latest"]

For more information, see the Grok MCP documentation.

Junie

To add the Playwright MCP server in Junie CLI:

Type /mcp
Press Ctrl+A to add a new MCP server
Select Playwright from the list

Alternatively, add to .junie/mcp/mcp.json:

config.json

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

For more information, see the Junie MCP configuration documentation.

Kiro

Follow the MCP Servers documentation. For example in .kiro/settings/mcp.json:

config.json

{
  "mcpServers": {
    "playwright": {
      "command": "npx",
      "args": [
        "@playwright/mcp@latest"
      ]
    }
  }
}

LM Studio

Click the button to install:

Or install manually:

Go to Program in the right sidebar -> Install -> Edit mcp.json. Use the standard config above.

opencode

Follow the MCP Servers documentation. For example in ~/.config/opencode/opencode.json:

config.json

{
  "$schema": "https://opencode.ai/config.json",
  "mcp": {
    "playwright": {
      "type": "local",
      "command": [
        "npx",
        "@playwright/mcp@latest"
      ],
      "enabled": true
    }
  }
}

Qodo Gen

Open Qodo Gen chat panel in VSCode or IntelliJ → Connect more tools → + Add new MCP → Paste the standard config above.

Click Save.

VS Code

Read the full README →View source on GitHub →

Related MCP Servers

View all in Browser Automation View all alternatives

Adoption & maintenance

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

GitHub stars

36k

Stargazers on the source repository.

Directory activity

2 views

Config copies, upvotes, and views on AllMCPs.

Reviews

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

Frequently Asked Questions about Playwright MCP

Playwright MCP provides an MCP interface for rich, persistent browser state and introspection, suitable for exploratory or long-running tasks, while Playwright CLI with SKILLS is more token-efficient and suited for coding agents needing concise commands.

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 Preview

Markdown (GitHub README)

[![AllMCPs](https://allmcps.com/api/badge/microsoft-playwright-mcp?style=directory)](https://allmcps.com/mcp/microsoft-playwright-mcp)

HTML Embed

<a href="https://allmcps.com/mcp/microsoft-playwright-mcp"><img src="https://allmcps.com/api/badge/microsoft-playwright-mcp?style=directory" alt="Playwright MCP on AllMCPs" /></a>

Technical Specs & Signals

CategoryBrowser Automation

PricingFree

74Quality signal: Great · 74/100How this signal is calculated ▾

Server availability25/25

Verified ownership19/20

Documentation & tools23/30

Adoption & activity7/15

Community engagement0/10

A guidance signal from public completeness & health data — not a user rating. New listings start lower and rise as they add docs, get verified, and grow adoption. Signals we can't observe for a listing are skipped, not counted against it.

Supply-chain signal

1 high-severity advisory on record for this package. Most advisories affect transitive dependencies and may not be exploitable in this server's actual usage — this is a directional signal, not a security audit.

Critical 0High 1Medium 0Low 0

Scanned 23d ago via OSV.dev · @playwright/mcp@latest (npm)

★ Featured

Moxie Docs MCP

MCP & Agent Skills for Automated Documentation, and codebase conventions + context

Explore Server →

Share & Embed

Add our SVG badge (dark/light directory styles) or embeddable widget to your site.

Explore more

More in 📂 Browser Automation →Best MCP servers for Browser Automation →Alternatives to Playwright MCP →Install in Claude Desktop Install in Cursor Install in VS Code

Playwright MCP

browser-automationplaywrightaccessibilitymcpllm-integration

MCP server providing browser automation via Playwright using structured accessibility snapshots for LLM interaction.

Quick Install

Automated & IDE Setup

Copy the AI prompt to install this server into Claude Code, Cursor, or another agent — or use 1-click editor setup below.

Add to Cursor Add to VS Code

Not yet automatically verified

We haven't yet run this listing's install command through our automated sandbox check. This isn't a red flag — we're steadily working through the catalog.

Manual Client & Custom JSON ConfigExpand JSON ▾

Client Config & Setup

Choose your client or environment

Target File:~/Library/Application Support/Claude/claude_desktop_config.json

claude_desktop_config.json

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

💡 Paste the JSON block into your client's configuration file under mcpServers, then restart the application.

Overview

Use cases

Automate web interactions using structured accessibility data

Perform exploratory browser automation with persistent state

Develop self-healing web tests with iterative page reasoning

Build long-running autonomous workflows involving web pages

Integrate browser control into LLM-powered agents

Key features

Uses Playwright accessibility tree instead of screenshots

LLM-friendly structured data interface

Supports persistent browser context and introspection

Deterministic tool application avoiding visual ambiguity

Compatible with multiple MCP clients

Capabilities & Tool Schemas

Inspect callable tools, capabilities, and parameters exposed to AI agents by Playwright MCP.

Extracted Tool Capabilities

Uses Playwright accessibility tree instead of screenshots

LLM-friendly structured data interface

Supports persistent browser context and introspection

Deterministic tool application avoiding visual ambiguity

Compatible with multiple MCP clients

Documentation Overview

Playwright MCP

Playwright MCP vs Playwright CLI

This package provides MCP interface into Playwright. If you are using a coding agent, you might benefit from using the CLI+SKILLS instead.

CLI: Modern coding agents increasingly favor CLI–based workflows exposed as SKILLs over MCP because CLI invocations are more token-efficient: they avoid loading large tool schemas and verbose accessibility trees into the model context, allowing agents to act through concise, purpose-built commands. This makes CLI + SKILLs better suited for high-throughput coding agents that must balance browser automation with large codebases, tests, and reasoning within limited context windows.
Learn more about Playwright CLI with SKILLS.
MCP: MCP remains relevant for specialized agentic loops that benefit from persistent state, rich introspection, and iterative reasoning over page structure, such as exploratory automation, self-healing tests, or long-running autonomous workflows where maintaining continuous browser context outweighs token cost concerns.

Key Features

Fast and lightweight. Uses Playwright's accessibility tree, not pixel-based input.
LLM-friendly. No vision models needed, operates purely on structured data.
Deterministic tool application. Avoids ambiguity common with screenshot-based approaches.

Requirements

Node.js 18 or newer
VS Code, Cursor, Windsurf, Claude Desktop, Goose, Grok, Junie or any other MCP client

Getting started

First, install the Playwright MCP server with your client.

Standard config works in most of the tools:

JSON Config

{
  "mcpServers": {
    "playwright": {
      "command": "npx",
      "args": [
        "@playwright/mcp@latest"
      ]
    }
  }
}

Amp

Add via the Amp VS Code extension settings screen or by updating your settings.json file:

json

"amp.mcpServers": {
  "playwright": {
    "command": "npx",
    "args": [
      "@playwright/mcp@latest"
    ]
  }
}

Amp CLI Setup:

Add via the amp mcp add command below

bash

amp mcp add playwright -- npx @playwright/mcp@latest

Antigravity

Add via the Antigravity settings or by updating your configuration file:

config.json

{
  "mcpServers": {
    "playwright": {
      "command": "npx",
      "args": [
        "@playwright/mcp@latest"
      ]
    }
  }
}

Claude Code

Use the Claude Code CLI to add the Playwright MCP server:

Terminal

claude mcp add playwright npx @playwright/mcp@latest

Claude Desktop

Follow the MCP install guide, use the standard config above.

Cline

Follow the instruction in the section Configuring MCP Servers

Example: Local Setup

Add the following to your cline_mcp_settings.json file:

config.json

{
  "mcpServers": {
    "playwright": {
      "type": "stdio",
      "command": "npx",
      "timeout": 30,
      "args": [
        "-y",
        "@playwright/mcp@latest"
      ],
      "disabled": false
    }
  }
}

Codex

Use the Codex CLI to add the Playwright MCP server:

bash

codex mcp add playwright npx "@playwright/mcp@latest"

Alternatively, create or edit the configuration file ~/.codex/config.toml and add:

toml

[mcp_servers.playwright]
command = "npx"
args = ["@playwright/mcp@latest"]

For more information, see the Codex MCP documentation.

Copilot

Use the Copilot CLI to interactively add the Playwright MCP server:

bash

/mcp add

Alternatively, create or edit the configuration file ~/.copilot/mcp-config.json and add:

config.json

{
  "mcpServers": {
    "playwright": {
      "type": "local",
      "command": "npx",
      "tools": [
        "*"
      ],
      "args": [
        "@playwright/mcp@latest"
      ]
    }
  }
}

For more information, see the Copilot CLI documentation.

Cursor

Click the button to install:

Or install manually:

Factory

Use the Factory CLI to add the Playwright MCP server:

bash

droid mcp add playwright "npx @playwright/mcp@latest"

Alternatively, type /mcp within Factory droid to open an interactive UI for managing MCP servers.

For more information, see the Factory MCP documentation.

Gemini CLI

Follow the MCP install guide, use the standard config above.

Goose

Click the button to install:

Or install manually:

Go to Advanced settings -> Extensions -> Add custom extension. Name to your liking, use type STDIO, and set the command to npx @playwright/mcp. Click "Add Extension".

Grok

Use the Grok CLI to add the Playwright MCP server:

bash

grok mcp add playwright -- npx @playwright/mcp@latest

Alternatively, create or edit the configuration file ~/.grok/config.toml and add:

toml

[mcp_servers.playwright]
command = "npx"
args = ["@playwright/mcp@latest"]

For more information, see the Grok MCP documentation.

Junie

To add the Playwright MCP server in Junie CLI:

Type /mcp
Press Ctrl+A to add a new MCP server
Select Playwright from the list

Alternatively, add to .junie/mcp/mcp.json:

config.json

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

For more information, see the Junie MCP configuration documentation.

Kiro

Follow the MCP Servers documentation. For example in .kiro/settings/mcp.json:

config.json

{
  "mcpServers": {
    "playwright": {
      "command": "npx",
      "args": [
        "@playwright/mcp@latest"
      ]
    }
  }
}

LM Studio

Click the button to install:

Or install manually:

Go to Program in the right sidebar -> Install -> Edit mcp.json. Use the standard config above.

opencode

Follow the MCP Servers documentation. For example in ~/.config/opencode/opencode.json:

config.json

{
  "$schema": "https://opencode.ai/config.json",
  "mcp": {
    "playwright": {
      "type": "local",
      "command": [
        "npx",
        "@playwright/mcp@latest"
      ],
      "enabled": true
    }
  }
}

Qodo Gen

Open Qodo Gen chat panel in VSCode or IntelliJ → Connect more tools → + Add new MCP → Paste the standard config above.

Click Save.

VS Code

Read the full README →View source on GitHub →

Related MCP Servers

View all in Browser Automation View all alternatives

Adoption & maintenance

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

GitHub stars

36k

Stargazers on the source repository.

Directory activity

2 views

Config copies, upvotes, and views on AllMCPs.

Reviews

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

Frequently Asked Questions about Playwright MCP

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 Preview

Markdown (GitHub README)

[![AllMCPs](https://allmcps.com/api/badge/microsoft-playwright-mcp?style=directory)](https://allmcps.com/mcp/microsoft-playwright-mcp)

HTML Embed

<a href="https://allmcps.com/mcp/microsoft-playwright-mcp"><img src="https://allmcps.com/api/badge/microsoft-playwright-mcp?style=directory" alt="Playwright MCP on AllMCPs" /></a>

Technical Specs & Signals

CategoryBrowser Automation

PricingFree

74Quality signal: Great · 74/100How this signal is calculated ▾

Server availability25/25

Verified ownership19/20

Documentation & tools23/30

Adoption & activity7/15

Community engagement0/10

Supply-chain signal

Critical 0High 1Medium 0Low 0

Scanned 23d ago via OSV.dev · @playwright/mcp@latest (npm)

★ Featured

Moxie Docs MCP

MCP & Agent Skills for Automated Documentation, and codebase conventions + context

Explore Server →

Share & Embed

Add our SVG badge (dark/light directory styles) or embeddable widget to your site.

Explore more

More in 📂 Browser Automation →Best MCP servers for Browser Automation →Alternatives to Playwright MCP →Install in Claude Desktop Install in Cursor Install in VS Code