Chrome DevTools MCP: Claude Code Skills for Browser Debugging

What is ChromeDevTools/chrome-devtools-mcp, actually

ChromeDevTools/chrome-devtools-mcp is the repository behind Chrome DevTools MCP, a server that lets a coding agent, Claude Code, Antigravity, Cursor, or Copilot among others, connect to and control a live Chrome browser: opening pages, clicking through a flow, reading network requests, capturing a performance trace. The repository carries nearly 49,700 GitHub stars, and Flowy files it under the development category.

The plugin Flowy indexes sits on top of that server: 6 skills, and every one of them is a skill, nothing else. Each one teaches an agent when the MCP connection is the right tool and which part of it to reach for, from everyday page debugging to accessibility audits, a single Core Web Vital, memory leak hunts, and scripted automation. Flowy indexes what the repository ships. It does not own, bundle, or host ChromeDevTools/chrome-devtools-mcp, and it does not run the browser connection either. That happens in your own Chrome instance once the MCP server is talking to it.

What is inside

One skill, chrome-devtools, is the general entry point. Its own description covers efficient debugging, troubleshooting, and browser automation: debugging web pages, automating interactions, analyzing performance, or inspecting network requests. It also carries one exception worth knowing before you rely on it: it does not apply when the server is running in slim mode, a reduced MCP configuration, so a trimmed down setup is not what this skill assumes.

Three more skills each target one specific kind of problem instead of general debugging, and a further two are not about a page at all, they are about the tool itself. That six-way split is the whole plugin.

The three problem specific skills

a11y-debugging runs accessibility audits and testing based on web.dev guidance: semantic HTML, ARIA labels, focus states, keyboard navigation, tap target sizing, and color contrast.

debug-optimize-lcp narrows to a single Core Web Vital, Largest Contentful Paint. It is written for when a page loads slowly, or someone wants to understand why the page's main content takes so long to appear, and for Core Web Vitals optimization more generally.

memory-leak-debugging diagnoses and resolves memory leaks in JavaScript and Node.js applications. It applies when a user reports high memory usage or an out-of-memory (OOM) error, or wants to capture, compare, or inspect heap snapshots with Chrome DevTools MCP's own memory tools.

The two skills that are not about a page at all

troubleshooting exists for when the connection itself is broken, not the page it is pointed at. Its own description names the trigger directly: invoke it when listing pages, opening a new page, or navigating to a page fails, or when the server itself fails to start. It draws on Chrome DevTools MCP's own documentation alongside the live connection to work out what is actually broken.

chrome-devtools-cli is for automation you can re-run rather than a live back and forth: writing shell scripts or running shell commands to drive the browser, or otherwise using Chrome DevTools from the command line.

When would I actually reach for this

Start with chrome-devtools for anything general: a page behaving oddly, a network call worth inspecting, a flow worth automating. Move to one of the three specialized skills once you already know the shape of the problem, an accessibility gap, a slow Largest Contentful Paint, or memory that keeps climbing, because each one is written around that single job. If nothing works at all, pages failing to list, open, or navigate, or the server refusing to start, that is a job for troubleshooting, not chrome-devtools. And if what you actually want is a script rather than a conversation, chrome-devtools-cli is the one built for that.

All 6 skills assume the same thing underneath: an MCP server actually connected to a live Chrome browser. None of them replace that connection, they tell an agent what to do once it already exists.

How do I install it

Flowy indexes ChromeDevTools/chrome-devtools-mcp from its public GitHub repository. Install from the listing page linked at the top of this guide, and all 6 skills above become available in that session, alongside the underlying MCP server connection they depend on.