Chrome DevTools MCP

// Overview

Chrome DevTools MCP is the Chrome team's official Model Context Protocol server for coding agents. It lets an agent such as Claude, Cursor, Copilot or Antigravity control and inspect a live Chrome browser, exposing the capabilities developers normally reach for in DevTools: recording performance traces, analysing network requests, taking screenshots, and reading console messages with source-mapped stack traces. A CLI is also provided for use without MCP.

Automation runs through Puppeteer, so actions wait for their results rather than racing the page — the practical difference between an agent that reliably clicks a button and one that clicks before the page settles. Performance work goes further than screenshots: the server records real DevTools traces and extracts actionable insights, and can optionally fetch field data from the Chrome User Experience Report to sit alongside the lab measurements (disabled with `--no-performance-crux`).

The project is explicit about its boundaries. It exposes the browser's contents to the MCP client, which can inspect, debug and modify anything in the browser or DevTools, so it warns against pointing it at sessions holding data you would not share. It officially supports Google Chrome and Chrome for Testing only. Usage statistics are collected by default and opt out with `--no-usage-statistics` or the CHROME_DEVTOOLS_MCP_NO_USAGE_STATISTICS environment variable.

// What it does

• Records Chrome DevTools performance traces and extracts actionable insights, optionally alongside CrUX field data
• Network request analysis, screenshots, and console messages with source-mapped stack traces
• Puppeteer-backed automation that waits for action results, making agent-driven browser steps reliable
• A `--slim` mode that exposes a reduced tool set for basic browser tasks, and `--headless` for CI-style runs
• A standalone CLI for using the same capabilities without an MCP client
• Opt-out switches for usage statistics, CrUX lookups and npm update checks

// Getting started

You need a current Node.js LTS, npm, and a current stable (or newer) Chrome. There is nothing to install ahead of time — the MCP client runs the server through npx.

{
  "mcpServers": {
    "chrome-devtools": {
      "command": "npx",
      "args": ["-y", "chrome-devtools-mcp@latest"]
    }
  }
}

{
  "mcpServers": {
    "chrome-devtools": {
      "command": "npx",
      "args": ["-y", "chrome-devtools-mcp@latest", "--slim", "--headless"]
    }
  }
}

Check the performance of https://developers.chrome.com

"args": ["-y", "chrome-devtools-mcp@latest", "--no-usage-statistics"]

Commands and code are distilled from the project's own documentation — always check the official repo for the latest.

// When to use it

• Ask a coding agent to profile a slow page and hand back DevTools-grade performance insights instead of guesses
• Let an agent reproduce a bug in a live browser and read the console error with a source-mapped stack trace
• Debug failing network calls by having the agent inspect the real requests a page makes
• Give an agent reliable browser automation for end-to-end checks, with Puppeteer waiting on each action

// How Chrome DevTools MCP compares

Chrome DevTools MCP alongside other open-source computer & browser use tools AI/TLDR tracks, ranked by GitHub stars.