cc_chrome_devtools_mcp_skill

Community

AI sees, tests, and fixes your web frontend.

Authorjustfinethanku
Version1.0.0
Installs0

System Documentation

What problem does it solve?

This Skill eliminates the guesswork from frontend debugging and testing. Instead of Claude guessing about UI issues or relying on manual screenshots, it gains direct "vision" into your web applications. It automates tedious tasks like performance testing, accessibility validation, and network analysis, allowing Claude to precisely identify and fix problems, saving you significant time and reducing complexity.

Core Features & Use Cases

  • Performance Testing: Automatically measure Core Web Vitals (INP, LCP, CLS) and identify performance bottlenecks.
  • Accessibility Validation: Inspect the accessibility tree, validate WCAG compliance, and ensure inclusive user experiences.
  • Browser Automation: Automate complex user flows like form filling, button clicks, and multi-tab navigation.
  • Use Case: Imagine your website's Core Web Vitals are failing. Use this skill to automatically run a performance trace, identify the largest contentful paint element, and get actionable recommendations to improve load speed.

Quick Start

Test the performance of https://example.com and identify any Core Web Vitals issues.

Dependency Matrix

Required Modules

chrome-devtools-mcp

Components

references

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: cc_chrome_devtools_mcp_skill
Download link: https://github.com/justfinethanku/cc_chrome_devtools_mcp_skill/archive/main.zip#cc-chrome-devtools-mcp-skill

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 471,000+ vetted skills library on demand.