Claude Code skills for browser debugging, automation, performance analysis, accessibility auditing, and LCP optimization — powered by the chrome-devtools CLI.
No MCP server needed. All commands run via chrome-devtools <tool> [args] in the shell.
| Skill | Description |
|---|---|
| chrome-devtools | Core browser debugging, automation, screenshots, and page inspection |
| a11y-debugging | Accessibility auditing based on web.dev guidelines |
| debug-optimize-lcp | Largest Contentful Paint debugging and optimization |
| chrome-devtools-troubleshooting | Connection and configuration diagnostics |
npm i chrome-devtools-mcp@latest -g # Install the CLI
chrome-devtools status # Verify it worksRequires Node.js v20.19+ and Chrome stable.
cp -r skills/* ~/.claude/skills//plugin marketplace add ddfourtwo/chrome-devtools-skill
/plugin install chrome-devtools-skillThe chrome-devtools CLI provides:
- Input automation (9): click, drag, fill, fill_form, handle_dialog, hover, press_key, type_text, upload_file
- Navigation (6): close_page, list_pages, navigate_page, new_page, select_page, wait_for
- Emulation (2): emulate, resize_page
- Performance (4): performance_analyze_insight, performance_start_trace, performance_stop_trace, take_memory_snapshot
- Network (2): get_network_request, list_network_requests
- Debugging (6): evaluate_script, get_console_message, lighthouse_audit, list_console_messages, take_screenshot, take_snapshot
Run chrome-devtools <command> --help for details on any command.
Skills content derived from ChromeDevTools/chrome-devtools-mcp under Apache-2.0.