Playwright MCP Details

Playwright MCP server. A Model Context Protocol (MCP) server that provides browser automation capabilities using Playwright. This server enables large language models (LLMs) to interact with web pages through structured accessibility snapshots, bypassing the need for screenshots or visually-tuned models. The server is designed to be fast, lightweight, and deterministic, offering LLM-friendly tooling and a rich set of browser automation capabilities via MCP tools. It supports standalone operation, containerized deployments, and integration with a variety of MCP clients (Claude Desktop, VS Code, Copilot, Cursor, Goose, Windsurf, and others).

Use Case

The Playwright MCP server exposes a suite of MCP tools that enable an LLM to perform browser automation tasks programmatically without relying on pixel-based input or screenshots. Users configure the server with a standard JSON config, launch it via npx @playwright/mcp@latest, and then invoke the available tools from their MCP client to interact with web pages. Example: configuring the server in a central config file and starting it with npx, then integrating with clients like VS Code or Claude Desktop. Example configurations from the docs include:

  • Standard config snippet for VS Code-like environments:
  • {
    "mcpServers": {
    "playwright": {
    "command": "npx",
    "args": ["@playwright/mcp@latest"]
    }
    }
    }

  • AMP CLI setup:
  • amp mcp add playwright -- npx @playwright/mcp@latest

  • Claude Code usage:
  • claude mcp add playwright npx @playwright/mcp@latest

  • Codex CLI usage:
  • codex mcp add playwright npx "@playwright/mcp@latest"

  • Copilot example (config file):
  • {
    "mcpServers": {
    "playwright": {
    "type": "local",
    "command": "npx",
    "tools": ["*"] ,
    "args": ["@playwright/mcp@latest"]
    }
    }
    }

  • VS Code CLI install:
  • <h1 class="text-2xl font-semibold mt-5 mb-3">For VS Code</h1>
    code --add-mcp '{"name":"playwright","command":"npx","args":["@playwright/mcp@latest"]}'

  • Docker example:
  • {
    "mcpServers": {
    "playwright": {
    "command": "docker",
    "args": ["run", "-i", "--rm", "--init", "--pull=always", "mcr.microsoft.com/playwright/mcp"]
    }
    }
    }

    These examples show how to configure and connect various MCP clients to the Playwright MCP server. Once configured, you can call tools such as browser_click, browser_type, browser_navigate, and many others to interact with pages in a structured, programmable way. The configuration also supports advanced options like --isolated, --storage-state for state persistence, and --config to supply a JSON configuration file for the server.

    Available Tools (26)

    Examples & Tutorials

    Real example usage patterns directly from the docs:

    1) Standard config snippet for starting Playwright MCP with the latest release (VS Code style):

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

    2) VS Code install command (integrate with Copilot/VSC):

    <h1 class="text-2xl font-semibold mt-5 mb-3">For VS Code</h1>
    code --add-mcp '{"name":"playwright","command":"npx","args":["@playwright/mcp@latest"]}'

    3) AMP CLI setup example:

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

    4) Claude Code CLI usage:

    claude mcp add playwright npx @playwright/mcp@latest

    5) Docker-based standalone server config:

    {
    "mcpServers": {
    "playwright": {
    "command": "docker",
    "args": ["run", "-i", "--rm", "--init", "--pull=always", "mcr.microsoft.com/playwright/mcp"]
    }
    }
    }

    6) Example with storage state and isolated mode (from User Profile):

    {
    "mcpServers": {
    "playwright": {
    "command": "npx",
    "args": ["@playwright/mcp@latest", "--isolated", "--storage-state={path/to/storage.json}"]
    }
    }
    }

    Installation Guide

    Step-by-step installation instructions with actual commands from the documentation:

  • Standard config snippet to start the Playwright MCP server using npm/npx:
  • {
    "mcpServers": {
    "playwright": {
    "command": "npx",
    "args": ["@playwright/mcp@latest"]
    }
    }
    }

  • Amp CLI setup:
  • amp mcp add playwright -- npx @playwright/mcp@latest

  • Claude Code CLI:
  • claude mcp add playwright npx @playwright/mcp@latest

  • Codex CLI:
  • codex mcp add playwright npx "@playwright/mcp@latest"

  • Copilot (config example):
  • {
    "mcpServers": {
    "playwright": {
    "type": "local",
    "command": "npx",
    "tools": ["*"] ,
    "args": ["@playwright/mcp@latest"]
    }
    }
    }

  • Cursor manual install (button or MCP settings): follow the UI flow described in the docs to add the Playwright MCP server via Cursor settings and the MCP config URL provided in the documentation.

  • Goose manual install:
  • Go to Advanced settings -> Extensions -> Add custom extension. Name to your liking, use type STDIO, and set the command to npx @playwright/mcp.

  • LM Studio manual install:
  • Go to Program -> Install -> Edit mcp.json. Use the standard config above.

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

  • Factory CLI:
  • droid mcp add playwright "npx @playwright/mcp@latest"

  • Qodo Gen / VS Code / Warp style examples are included in the docs to show how to paste the standard config above into various environments.
  • Integration Guides

    Frequently Asked Questions

    Is this your MCP?

    Claim ownership and get verified badge

    Repository Stats
    Important Notes

    Notes and limitations from the docs:

  • Node.js 18 or newer is required.

  • The Docker implementation currently only supports headless Chromium.

  • The server can be configured to persist state with --isolate and --storage-state.

  • The PCI (MCP) tools require corresponding clients (Claude Desktop, VS Code, Cursor, Goose, Windsurf, etc.) to interact with the server.
  • Prerequisites

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

    Details
    Last Updated1/2/2026
    SourceGitHub

    Compare Alternatives

    Similar MCP Tools

    6 related tools
    Anki MCP Server

    Anki MCP Server

    A Model Context Protocol (MCP) server that enables AI assistants to interact with Anki, the spaced repetition flashcard application. The Anki MCP Server allows AI models to access Anki's card data, enabling features like automated flashcard creation, review, and management.

    1MCP Agent

    1MCP Agent

    A unified Model Context Protocol server implementation that aggregates multiple MCP servers into one. The 1mcp-app/agent is an open-source project that provides a single entry point for multiple MCP servers, making it easier to manage and interact with various AI models and tools.

    Roundtable AI MCP Server

    Roundtable AI MCP Server

    Roundtable AI MCP Server is a zero-configuration local MCP server that unifies multiple AI coding assistants (Codex, Claude Code, Cursor, Gemini) through intelligent auto-discovery and a standardized interface. It coordinates specialized sub-agents from within your IDE to solve engineering problems in parallel, sharing context and synthesizing responses into a single, high-quality output. This documentation details installation, available MCP tools, integration with popular IDEs, and a broad ecosystem of specialized tools and CLIs that can be invoked as part of a roundtable-powered workflow, enabling developers to delegate tasks to the right AI for each facet of a problem without leaving their development environment.

    MCPJungle

    MCPJungle

    MCPJungle is a self-hosted MCP Gateway and Registry for AI agents. It serves as a central registry and gateway to manage Model Context Protocol (MCP) servers and the tools they expose. By consolidating MCP server registration, tool discovery, and access control, MCPJungle enables AI agents and clients to discover, group, and securely invoke tools from a single, unified gateway. The project provides a CLI, Docker-based deployment options, and enterprise-ready features such as tool grouping, access control, and observability to streamline MCP-based workflows across organizations.

    mcpmcp-server

    mcpmcp-server

    mcpmcp-server is a focused solution for discovering, setting up, and integrating MCP servers with your favorite clients to unlock AI-powered workflows. It streamlines how you connect MCP-powered servers to popular clients, enabling seamless AI-assisted interactions across your daily tools. The project emphasizes an approachable, config-driven approach to linking MCP servers with clients like Claude Desktop, while directing you to the homepage for variations across apps and platforms. This README highlights a practical JSON configuration example and notes on supported environments, helping you get started quickly and confidently.

    Imagen3-MCP

    Imagen3-MCP

    Imagen3-MCP is an image generation service based on Google's Imagen 3.0 that exposes its functionality through MCP (Model Control Protocol). The project provides a server to run a local MCP service that accesses Google Gemini-powered image generation, enabling developers to integrate advanced image synthesis into their applications. The documentation covers prerequisites (Gemini API key), installation steps for Cherry Studio, and a Cursor-based JSON configuration example for embedding the MCP server in broader tooling. This MCP is designed to be deployment-friendly, with configurable environment variables and optional proxy settings to adapt to various network environments.