Chrome DevTools MCP

Chrome DevTools MCP (also called Chrome DevTools for agents) is the Chrome team's own MCP server. It lets your coding agent control and inspect a live Chrome browser with the same tools you use in DevTools, so it can see what the code it wrote actually does in the browser. What you can do with it - Check in the browser that a change your agent made works as expected - Diagnose network and console errors, such as CORS problems or images that don't load - Reproduce bugs by navigating, filling out forms and clicking through a flow - Inspect the DOM and CSS of a live page to fix layout and styling problems - Record performance traces and dig into insights such as a slow LCP - Take screenshots, run Lighthouse audits and analyse memory heap snapshots How it connects It runs on your machine through npx (chrome-devtools-mcp@latest) and needs Node.js and a current version of Chrome. Chrome starts the first time your agent uses a tool that needs it. Automation runs on Puppeteer, which waits for each action's result. Good to know Your agent can see and change anything in that browser, so don't use it with accounts or data you don't want to share. Performance tools can send trace URLs to Google's Chrome UX Report API for real-user data; the --no-performance-crux flag turns that off. The --slim flag exposes a smaller set of tools for basic browser tasks. It also comes as a Claude Code plugin and a Gemini CLI extension, with skills for accessibility, LCP, memory leaks and cookie debugging.