ChromeDevTools/chrome-devtools-mcp
Chrome DevTools for coding agents
Platform-specific configuration:
{
"mcpServers": {
"chrome-devtools-mcp": {
"command": "npx",
"args": [
"-y",
"chrome-devtools-mcp"
]
}
}
}Add the config above to .claude/settings.json under the mcpServers key.
[](https://npmjs.org/package/chrome-devtools-mcp)
chrome-devtools-mcp lets your coding agent (such as Gemini, Claude, Cursor or Copilot) control and inspect a live Chrome browser. It acts as a Model-Context-Protocol (MCP) server, giving your AI coding assistant access to the full power of Chrome DevTools for reliable automation, in-depth debugging, and performance analysis.
DevTools](https://github.com/ChromeDevTools/devtools-frontend) to record traces and extract actionable performance insights.
check browser console messages (with source-mapped stack traces).
puppeteer to automate actions in Chrome and automatically wait for action results.
chrome-devtools-mcp exposes content of the browser instance to the MCP clients allowing them to inspect, debug, and modify any data in the browser or DevTools. Avoid sharing sensitive or personal information that you don't want to share with MCP clients.
Performance tools may send trace URLs to the Google CrUX API to fetch real-user experience data. This helps provide a holistic performance picture by presenting field data alongside lab data. This data is collected by the Chrome User Experience Report (CrUX). To disable this, run with the --no-performance-crux flag.
Google collects usage statistics (such as tool invocation success rates, latency, and environment information) to improve the reliabi
Loading reviews...