Control and inspect a live Chrome browser with your AI coding assistant
Uses Chrome DevTools to record traces and extract actionable performance insights.
Analyze network requests, take screenshots and check browser console messages (with source-mapped stack traces).
Uses 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.
chrome-devtools-mcp officially supports Google Chrome and Chrome for Testing only. Other Chromium-based browsers may work, but this is not guaranteed, and you may encounter unexpected behavior. Use at your discretion. We are committed to providing fixes and support for the latest version of Extended Stable Chrome.
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 reliability and performance of Chrome DevTools MCP.
Data collection is enabled by default. You can opt-out by passing the --no-usage-statistics flag when starting the server:
"args": ["-y", "chrome-devtools-mcp@latest", "--no-usage-statistics"]Google handles this data in accordance with the Google Privacy Policy.
Google's collection of usage statistics for Chrome DevTools MCP is independent from the Chrome browser's usage statistics. Opting out of Chrome metrics does not automatically opt you out of this tool, and vice-versa.
Collection is disabled if CHROME_DEVTOOLS_MCP_NO_USAGE_STATISTICS or CI env variables are set.
Add the following config to your MCP client:
{
"mcpServers": {
"chrome-devtools": {
"command": "npx",
"args": ["-y", "chrome-devtools-mcp@latest"]
}
}
}If you are interested in doing only basic browser tasks, use the --slim mode:
{
"mcpServers": {
"chrome-devtools": {
"command": "npx",
"args": ["-y", "chrome-devtools-mcp@latest", "--slim", "--headless"]
}
}
}The Chrome DevTools MCP server supports the following configuration option:
Pass them via the args property in the JSON configuration:
{
"mcpServers": {
"chrome-devtools": {
"command": "npx",
"args": [
"chrome-devtools-mcp@latest",
"--channel=canary",
"--headless=true",
"--isolated=true"
]
}
}
}Connecting via WebSocket with custom headers:
{
"mcpServers": {
"chrome-devtools": {
"command": "npx",
"args": [
"chrome-devtools-mcp@latest",
"--wsEndpoint=ws://127.0.0.1:9222/devtools/browser/",
"--wsHeaders={\"Authorization\":\"Bearer YOUR_TOKEN\"}"
]
}
}
} Most MCP clients start one Chrome DevTools MCP server per conversation. If your client shares a single server instance across concurrent agents or subagents, start the server with --experimentalPageIdRouting.
{
"mcpServers": {
"chrome-devtools": {
"command": "npx",
"args": [
"-y",
"chrome-devtools-mcp@latest",
"--experimentalPageIdRouting"
]
}
}
}chrome-devtools-mcp starts a Chrome's stable channel instance using the following user data directory:
The user data directory is not cleared between runs and shared across all instances of chrome-devtools-mcp. Set the isolated option to true to use a temporary user data dir instead which will be cleared automatically after the browser is closed.
By default, the Chrome DevTools MCP server will start a new Chrome instance with a dedicated profile. This might not be ideal in all situations. There are two ways to connect to a running Chrome instance:
Step 1: Set up remote debugging in Chrome. Navigate to chrome://inspect/#remote-debugging to enable remote debugging. Follow the dialog UI to allow or disallow incoming debugging connections.
Step 2: Configure Chrome DevTools MCP server to automatically connect to a running Chrome Instance:
{
"mcpServers": {
"chrome-devtools": {
"command": "npx",
"args": ["chrome-devtools-mcp@latest", "--autoConnect"]
}
}
}Step 3: Test your setup by running a prompt in your MCP client.
Step 1: Configure the MCP client:
{
"mcpServers": {
"chrome-devtools": {
"command": "npx",
"args": [
"chrome-devtools-mcp@latest",
"--browser-url=http://127.0.0.1:9222"
]
}
}
}Step 2: Start the Chrome browser with the remote debugging port enabled.
Step 3: Test your setup by running a prompt in your MCP client.