Skip to content
MyAI Guide

ChromeDevTools/chrome-devtools-mcp

claude-code

Chrome DevTools for coding agents

Official Google Chrome repo leads MCP at 33,560 stars, outpacing Playwright with native browser access. Vibe builders resolve 'app broke, no idea why' by feeding Claude console errors, network fails, stack traces. Developers trace LCP/CLS/INP, memory snapshots, Lighthouse audits.

36,159 stars2,214 forksTypeScriptUpdated April 2026

Best for

Vibe BuilderDeveloper
✅ Reviewed by My AI Guide — vetted for vibe builders

Our Review

Chrome DevTools MCP is the official Google Chrome DevTools MCP server -- 33,560 stars. The ChromeDevTools team built it under Apache-2.0 to let AI agents inspect live Chrome via DevTools Protocol.

Capabilities exposed:

  • •Performance tracing records traces and pulls LCP, CLS, INP, FCP metrics for web vitals fixes.
  • •Browser debugging checks network requests, console messages with source-mapped stacks, takes screenshots.
  • •Puppeteer automation waits for actions, handles dialogs, fills forms, clicks elements.
  • •Memory leak detection captures heap snapshots for analysis (v0.21.0, 2026).
  • •Lighthouse audits runs automated scores for performance and accessibility.

Compatible clients:

  • •Claude Code direct console access solves vibe builder crashes.
  • •Cursor and VS Code integrates for AI-assisted debugging workflows.
  • •Claude Desktop pairs with --headless for CI runs.

Getting started:

Run npx @chromedevtools/mcp to start the server. Connect your AI agent like Claude Code via MCP plugin. Use --slim for basics, --headless for background. Docs cover full setup.

Limitations:

Chrome-only support limits multi-browser tests. Default usage stats track by Google (opt-out with flag). Exposes browser content to AI clients -- review privacy before use.

Cons

  • Chrome-only -- no Firefox or Safari support.
  • Collects usage statistics by default -- opt out required for privacy.
  • Needs Node.js and local Chrome install -- setup blocks quick starts.
  • Large tool surface in full mode -- use --slim to reduce scope.

Our Verdict

Vibe builders end 'app broke no idea why' pain. Chrome DevTools MCP feeds Claude Code live console logs, network errors, and screenshots. Fix issues fast without manual copy-paste.

Developers profile real apps with traces, memory snapshots, and Lighthouse. Official Google depth beats Puppeteer wrappers. Target Core Web Vitals and leaks in production code.

Skip if you need cross-browser tests or run without Node.js setup. Basic users find config too technical.

Pick this for Chrome debugging authority in 2026 AI stacks.

Frequently Asked Questions

What is Chrome DevTools MCP and what does it do?

Chrome DevTools MCP is an MCP server from the ChromeDevTools Google Chrome team. It lets AI agents control live Chrome browsers for debugging, tracing performance, and automation. For instance, an agent can launch a session, navigate to a URL, and run CDP commands to inspect DOM elements or log network activity.

Is Chrome DevTools MCP free and open source?

Chrome DevTools MCP runs under Apache-2.0 license. Download and use it free from GitHub with 33,560 stars. Fork the repository on GitHub to add custom MCP endpoints for features like automated screenshot capture in tests. Rebuild the project using `npm run build` to test modifications locally.

Chrome DevTools MCP vs Playwright MCP -- which should I use?

Chrome DevTools MCP excels in Chrome debugging with traces and memory tools like heap snapshots. Playwright MCP handles multi-browser automation. Choose Chrome DevTools MCP when diagnosing slow or broken Chrome apps via Performance traces, Playwright MCP when you test across browsers.

How do I use Chrome DevTools MCP to debug a broken web app with Claude Code?

Start the server with `npx @chromedevtools/mcp`. Install the MCP plugin in Claude Code. Prompt Claude to inspect console, network, or take screenshots -- it reads source-mapped stacks directly. For a JS crash, say "show source-mapped stack trace" to see original lines; for API fails, prompt "filter network by 500 errors".

Does Chrome DevTools MCP work with Claude Desktop, Cursor, and VS Code?

Chrome DevTools MCP connects to Claude Desktop via MCP, Cursor through plugins, and VS Code extensions in 2026. All expose the full DevTools Protocol for agent control. For example, agents run Runtime.evaluate({expression: "document.title"}) to fetch page titles or Network.setCacheDisabled({cacheDisabled: true}) for testing without cache.

What is chrome-devtools-mcp?

Official Google Chrome repo leads MCP at 33,560 stars, outpacing Playwright with native browser access. Vibe builders resolve 'app broke, no idea why' by feeding Claude console errors, network fails, stack traces. Developers trace LCP/CLS/INP, memory snapshots, Lighthouse audits.

What license does chrome-devtools-mcp use?

chrome-devtools-mcp uses the Apache-2.0 license.

What are alternatives to chrome-devtools-mcp?

Explore related tools and alternatives on My AI Guide.

Great for: Pro Vibe Builders

Skip if: You need something more beginner-friendly or guided

🔒

Open source & community-verified

Apache-2.0 licensed — free to use in any project, no strings attached. 36,159 developers have starred this, meaning the community has reviewed and trusted it.

Reviewed by My AI Guide for relevance, quality, and active maintenance before listing.

Install in Claude Code:

/install chrome-devtools-mcp
← Browse more repos