playwright-mcp

Name: playwright-mcp
Author: microsoft

26Minstalls/mo · npm35kstars2.9kforks

How to install playwright-mcp?

microsoft/playwright-mcp

$git clone https://github.com/microsoft/playwright-mcp

Installs into the current project.

Summary

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 mod

Files · 1

View on GitHub

README.md

1	## Playwright MCP
2
3	A Model Context Protocol (MCP) server that provides browser automation capabilities using [Playwright](https://playwright.dev). This server enables LLMs to interact with web pages through structured accessibility snapshots, bypassing the need for screenshots or visually-tuned models.
4
5	### Playwright MCP vs Playwright CLI
6
7	This package provides MCP interface into Playwright. If you are using a coding agent, you might benefit from using the [CLI+SKILLS](https://github.com/microsoft/playwright-cli) instead.
8
9	- 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.<br>Learn more about [Playwright CLI with SKILLS](https://github.com/microsoft/playwright-cli).
10
11	- 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.
12
13	### Key Features
14
15	- Fast and lightweight. Uses Playwright's accessibility tree, not pixel-based input.
16	- LLM-friendly. No vision models needed, operates purely on structured data.
17	- Deterministic tool application. Avoids ambiguity common with screenshot-based approaches.
18
19	### Requirements
20	- Node.js 18 or newer
21	- VS Code, Cursor, Windsurf, Claude Desktop, Goose, Grok, Junie or any other MCP client
22
23	<!--
24	// Generate using:
25	node utils/generate-links.js
26	-->
27
28	### Getting started
29
30	First, install the Playwright MCP server with your client.
31
32	Standard config works in most of the tools:
33
34	```js
35	{
36	"mcpServers": {
37	"playwright": {
38	"command": "npx",
39	"args": [
40	"@playwright/mcp@latest"
41	]
42	}
43	}
44	}
45	```
46
47	[<img src="https://img.shields.io/badge/VS_Code-VS_Code?style=flat-square&label=Install%20Server&color=0098FF" alt="Install in VS Code">](https://insiders.vscode.dev/redirect?url=vscode%3Amcp%2Finstall%3F%257B%2522name%2522%253A%2522playwright%2522%252C%2522command%2522%253A%2522npx%2522%252C%2522args%2522%253A%255B%2522%2540playwright%252Fmcp%2540latest%2522%255D%257D) [<img alt="Install in VS Code Insiders" src="https://img.shields.io/badge/VS_Code_Insiders-VS_Code_Insiders?style=flat-square&label=Install%20Server&color=24bfa5">](https://insiders.vscode.dev/redirect?url=vscode-insiders%3Amcp%2Finstall%3F%257B%2522name%2522%253A%2522playwright%2522%252C%2522command%2522%253A%2522npx%2522%252C%2522args%2522%253A%255B%2522%2540playwright%252Fmcp%2540latest%2522%255D%257D)
48
49	<details>
50	<summary>Amp</summary>
51
52	Add via the Amp VS Code extension settings screen or by updating your settings.json file:
53
54	```json
55	"amp.mcpServers": {
56	"playwright": {
57	"command": "npx",
58	"args": [
59	"@playwright/mcp@latest"
60	]
61	}
62	}
63	```
64
65	Amp CLI Setup:
66
67	Add via the `amp mcp add` command below
68
69	```bash
70	amp mcp add playwright -- npx @playwright/mcp@latest
71	```
72
73	</details>
74
75	<details>
76	<summary>Antigravity</summary>
77
78	Add via the Antigravity settings or by updating your configuration file:
79
80	```json
81	{
82	"mcpServers": {
83	"playwright": {
84	"command": "npx",
85	"args": [
86	"@playwright/mcp@latest"
87	]
88	}
89	}
90	}
91	```
92
93	</details>
94
95	<details>
96	<summary>Claude Code</summary>
97
98	Use the Claude Code CLI to add the Playwright MCP server:
99
100	```bash
101	claude mcp add playwright npx @playwright/mcp@latest
102	```
103	</details>
104
105	<details>
106	<summary>Claude Desktop</summary>
107
108	Follow the MCP install [guide](https://modelcontextprotocol.io/quickstart/user), use the standard config above.
109
110	</details>

People who liked this also viewed

6 picks

Type

playwright-mcp

26Minstalls/mo · npm35kstars2.9kforks

View on GitHub

How to install playwright-mcp?

microsoft/playwright-mcp

$git clone https://github.com/microsoft/playwright-mcp

Installs into the current project.

Summary

Files · 1

View on GitHub

README.md

1	## Playwright MCP
2
3	A Model Context Protocol (MCP) server that provides browser automation capabilities using [Playwright](https://playwright.dev). This server enables LLMs to interact with web pages through structured accessibility snapshots, bypassing the need for screenshots or visually-tuned models.
4
5	### Playwright MCP vs Playwright CLI
6
7	This package provides MCP interface into Playwright. If you are using a coding agent, you might benefit from using the [CLI+SKILLS](https://github.com/microsoft/playwright-cli) instead.
8
9	- 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.<br>Learn more about [Playwright CLI with SKILLS](https://github.com/microsoft/playwright-cli).
10
11	- 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.
12
13	### Key Features
14
15	- Fast and lightweight. Uses Playwright's accessibility tree, not pixel-based input.
16	- LLM-friendly. No vision models needed, operates purely on structured data.
17	- Deterministic tool application. Avoids ambiguity common with screenshot-based approaches.
18
19	### Requirements
20	- Node.js 18 or newer
21	- VS Code, Cursor, Windsurf, Claude Desktop, Goose, Grok, Junie or any other MCP client
22
23	<!--
24	// Generate using:
25	node utils/generate-links.js
26	-->
27
28	### Getting started
29
30	First, install the Playwright MCP server with your client.
31
32	Standard config works in most of the tools:
33
34	```js
35	{
36	"mcpServers": {
37	"playwright": {
38	"command": "npx",
39	"args": [
40	"@playwright/mcp@latest"
41	]
42	}
43	}
44	}
45	```
46
47	[<img src="https://img.shields.io/badge/VS_Code-VS_Code?style=flat-square&label=Install%20Server&color=0098FF" alt="Install in VS Code">](https://insiders.vscode.dev/redirect?url=vscode%3Amcp%2Finstall%3F%257B%2522name%2522%253A%2522playwright%2522%252C%2522command%2522%253A%2522npx%2522%252C%2522args%2522%253A%255B%2522%2540playwright%252Fmcp%2540latest%2522%255D%257D) [<img alt="Install in VS Code Insiders" src="https://img.shields.io/badge/VS_Code_Insiders-VS_Code_Insiders?style=flat-square&label=Install%20Server&color=24bfa5">](https://insiders.vscode.dev/redirect?url=vscode-insiders%3Amcp%2Finstall%3F%257B%2522name%2522%253A%2522playwright%2522%252C%2522command%2522%253A%2522npx%2522%252C%2522args%2522%253A%255B%2522%2540playwright%252Fmcp%2540latest%2522%255D%257D)
48
49	<details>
50	<summary>Amp</summary>
51
52	Add via the Amp VS Code extension settings screen or by updating your settings.json file:
53
54	```json
55	"amp.mcpServers": {
56	"playwright": {
57	"command": "npx",
58	"args": [
59	"@playwright/mcp@latest"
60	]
61	}
62	}
63	```
64
65	Amp CLI Setup:
66
67	Add via the `amp mcp add` command below
68
69	```bash
70	amp mcp add playwright -- npx @playwright/mcp@latest
71	```
72
73	</details>
74
75	<details>
76	<summary>Antigravity</summary>
77
78	Add via the Antigravity settings or by updating your configuration file:
79
80	```json
81	{
82	"mcpServers": {
83	"playwright": {
84	"command": "npx",
85	"args": [
86	"@playwright/mcp@latest"
87	]
88	}
89	}
90	}
91	```
92
93	</details>
94
95	<details>
96	<summary>Claude Code</summary>
97
98	Use the Claude Code CLI to add the Playwright MCP server:
99
100	```bash
101	claude mcp add playwright npx @playwright/mcp@latest
102	```
103	</details>
104
105	<details>
106	<summary>Claude Desktop</summary>
107
108	Follow the MCP install [guide](https://modelcontextprotocol.io/quickstart/user), use the standard config above.
109
110	</details>

People who liked this also viewed

6 picks

Type