chrome-devtools
Uses Chrome DevTools via MCP for efficient debugging, troubleshooting and browser automation. Use when debugging web pages, automating browser interactions, analyzing performance, or inspecting network requests. This skill does not apply to `--slim` mode (MCP configuration).
Install
With your agent
Install OMGSkills skill "chromedevtools/chrome-devtools-mcp:chrome-devtools" into this agent's normal skills directory: use the OMGSkills MCP get_skill tool, install only the pinned_install commit and path, verify SKILL.md against pinned_install.skill_md_sha, and stop if MCP or the pin is unavailable. Do not overwrite or change existing skills without asking me.
Manual command
git clone https://github.com/ChromeDevTools/chrome-devtools-mcp /tmp/chrome-devtools-mcp && ln -s /tmp/chrome-devtools-mcp/skills/chrome-devtools ~/.claude/skills/chrome-devtoolsFrom README
Core Concepts Browser lifecycle: Browser starts automatically on first tool call using a persistent Chrome profile. Configure via CLI args in the MCP server configuration: npx chrome-devtools-mcp@latest --help. Addional tooling can be enabled by providing the following flags: For extension tooling, use the --categoryExtensions flag. For memory tooling, use the --memoryDebugging flag. Page targeting: Page-scoped tools require a pageId parameter to target a specific page. Use listpages to see available pages and their IDs (e.g. pageId: 1), or use the ID returned when creating a page with newpage. Note: For evaluatescript, pageId is required when targeting pages. However, when --categoryExtensions is enabled, pageId is optional so you can pass serviceWorkerId instead to evaluate inside an extension background service worker. Element interaction: Use takesnapshot to get page structure with element uids. Each element has a unique uid for interaction.
More from this repo
a11y-debugging
Uses Chrome DevTools MCP for accessibility (a11y) debugging and auditing based on web.dev guidelines.
chrome-devtools-cli
Used to write shell scripts or run shell commands to automate tasks in the browser or otherwise use Chrome DevTools via...
debug-optimize-lcp
Guides debugging and optimizing Largest Contentful Paint (LCP) using Chrome DevTools MCP tools.