Skip to main content

← All sources

Chrome DevTools MCP skills

6 first-party Chrome DevTools skills for coding agents — browser automation, accessibility debugging, LCP/Core Web Vitals optimization, memory-leak diagnosis, CLI scripting, and MCP troubleshooting via the official DevTools MCP. skills-hub.ai mirrors 6 skills from Chrome DevTools MCP daily, every skill links back to its upstream GitHub source. Install with one command across Claude Code, Cursor, Codex, Windsurf, and any MCP-compatible tool.

Upstream: github.com/ChromeDevTools/chrome-devtools-mcp

Installing a Chrome DevTools MCP skill

Pick a skill below, then run the install command for your AI coding tool. The skills-hub CLI writes the SKILL.md to the right directory and tracks the install in .skills.json so your team gets reproducible installs.

# Install a Chrome DevTools MCP skill
npx @skills-hub-ai/cli install <skill-slug>

# Browse all Chrome DevTools MCP skills via API
curl https://skills-hub.ai/api/v1/skills?source=chrome-devtools-mcp

# Browse all sources
open https://skills-hub.ai/sources

Top Chrome DevTools MCP skills

See all →

The most-installed skills from Chrome DevTools MCP, ranked by adoption.

  1. 01a11y-debugging

    Uses Chrome DevTools MCP for accessibility (a11y) debugging and auditing based on web.dev guidelines. Use when testing semantic HTML, ARIA labels, focus states, keyboard navigation, tap targets, and color contrast.

    Buildfrom Chrome DevTools MCP
  2. 02troubleshooting

    Uses Chrome DevTools MCP and documentation to troubleshoot connection and target issues. Trigger this skill when list_pages, new_page, or navigate_page fail, or when the server initialization fails.

    Buildfrom Chrome DevTools MCP
  3. 03chrome-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).

    Buildfrom Chrome DevTools MCP
  4. 04chrome-devtools-cli

    Use this skill to write shell scripts or run shell commands to automate tasks in the browser or otherwise use Chrome DevTools via CLI.

    Buildfrom Chrome DevTools MCP
  5. 05debug-optimize-lcp

    Guides debugging and optimizing Largest Contentful Paint (LCP) using Chrome DevTools MCP tools. Use this skill whenever the user asks about LCP performance, slow page loads, Core Web Vitals optimization, or wants to understand why their page's main content takes too long to appear. Also use when the user mentions "largest contentful paint", "page load speed", "CWV", or wants to improve how fast their hero image or main content renders.

    Buildfrom Chrome DevTools MCP
  6. 06memory-leak-debugging

    Diagnoses and resolves memory leaks in JavaScript/Node.js applications. Use when a user reports high memory usage, OOM errors, or wants to analyze heapsnapshots or run memory leak detection tools like memlab.

    Buildfrom Chrome DevTools MCP

About this source

skills-hub.ai mirrors skills from 90+ official GitHub repositories every day. Each imported skill is parsed from a SKILL.md file in the source repo, gets a security scan and quality score on import, and links back to its upstream source of truth.

Last sync: Jun 30, 2026, 11:07 PM (success).

Chrome DevTools MCP skills, frequently asked

What are Chrome DevTools MCP skills?

Chrome DevTools MCP skills are AI coding skills published by Chrome DevTools MCP (6 first-party Chrome DevTools skills for coding agents — browser automation, accessibility debugging, LCP/Core Web Vitals optimization, memory-leak diagnosis, CLI scripting, and MCP troubleshooting via the official DevTools MCP.) and mirrored daily on skills-hub.ai. They are SKILL.md files that follow the open Agent Skills standard, so they work in Claude Code, Cursor, Codex CLI, Windsurf, Copilot, and any MCP-compatible tool.

How many Chrome DevTools MCP skills are available?

skills-hub.ai indexes 6 skills from Chrome DevTools MCP, synced daily from the upstream GitHub repository (https://github.com/ChromeDevTools/chrome-devtools-mcp).

How do I install a Chrome DevTools MCP skill?

Run `npx @skills-hub-ai/cli install <skill-slug>` in your project. The CLI writes the SKILL.md to the right directory for your AI tool and adds it to your `.skills.json` lockfile so your team gets the same skills at the same versions.

Are these official Chrome DevTools MCP skills?

Yes. Every skill from this source is mirrored from Chrome DevTools MCP's own GitHub repository (https://github.com/ChromeDevTools/chrome-devtools-mcp). Each skill page links back to the upstream source of truth, so you can verify the original.