← All skills
browser-debugger
67 / 100 · Review before installing
Check before installing.
By MadAppGang/claude-code (GitHub) · design · 288 stars · scanned at commit 6097ad4
Systematically tests UI functionality, validates design fidelity with AI visual analysis, monitors console output, tracks network requests, and provides debugging reports using Chrome DevTools MCP. Use after implementing UI features, for design validation, when investigating console errors, for regression testing, or when user mentions testing, browser bugs, console errors, or UI verification.
Works with any agent that supports SKILL.md skills.
What this skill can do
Runs commands on your computer
The author does not mention this. It runs automatically when the plugin is installed.
Found in 12 places.
Show 9 more
- plugins/frontend/skills/browser-debugger/SKILL.md, line 142
jq --arg model "$SELECTED_MODEL" '.visualAnalysisModel = $model' \ - plugins/frontend/skills/browser-debugger/SKILL.md, line 150
jq --arg model "$SELECTED_MODEL" \ - plugins/frontend/skills/browser-debugger/SKILL.md, line 163
npx claudish --model "$VISUAL_MODEL" --stdin --quiet <<EOF - plugins/frontend/skills/browser-debugger/SKILL.md, line 241
case "$USER_CHOICE" in - plugins/frontend/skills/browser-debugger/SKILL.md, line 594
npx claudish --model qwen/qwen3-vl-32b-instruct --stdin --quiet <<EOF - plugins/frontend/skills/browser-debugger/SKILL.md, line 878
for width in 375 768 1280; do - plugins/frontend/.mcp.json, line 3
"command": "npx", - plugins/frontend/.mcp.json, line 11
"command": "npx", - plugins/frontend/.mcp.json, line 18
"command": "npx",
Downloads and installs other software
The author does not mention this.
Found in 32 places.
Show 17 more
- plugins/frontend/skills/browser-debugger/SKILL.md, line 317
npx claudish --model qwen/qwen3-vl-32b-instruct --stdin --quiet <<EOF - plugins/frontend/skills/browser-debugger/SKILL.md, line 398
npx claudish --model qwen/qwen3-vl-32b-instruct --stdin --quiet <<EOF - plugins/frontend/skills/browser-debugger/SKILL.md, line 533
npx claudish --model google/gemini-2.5-flash --stdin --quiet <<EOF - plugins/frontend/skills/browser-debugger/SKILL.md, line 594
npx claudish --model qwen/qwen3-vl-32b-instruct --stdin --quiet <<EOF - plugins/frontend/skills/browser-debugger/SKILL.md, line 642
npx claudish --model qwen/qwen3-vl-32b-instruct --stdin --quiet <<EOF - plugins/frontend/skills/browser-debugger/SKILL.md, line 850
npx claudish --model qwen/qwen3-vl-32b-instruct --stdin --quiet <<EOF - plugins/frontend/skills/browser-debugger/SKILL.md, line 883
npx claudish --model google/gemini-2.5-flash --stdin --quiet <<EOF - plugins/frontend/agents/ui-developer.md, line 631
npx tsc --noEmit - plugins/frontend/agents/ui-developer.md, line 638
npx eslint . - plugins/frontend/commands/help.md, line 109
npm install -g claudeup@latest && claudeup mcp add chrome-devtools - plugins/frontend/commands/implement-ui.md, line 492
- Run typecheck: `npx tsc --noEmit` - plugins/frontend/commands/implement.md, line 105
- Ensure Claudish is installed: `npx claudish --version` - plugins/frontend/commands/implement.md, line 107
- Agents use single-shot mode: `npx claudish --model <model> --stdin --quiet` - plugins/frontend/commands/implement.md, line 186
npm install -g claudeup@latest - plugins/frontend/commands/implement.md, line 198
"command": "npx", - plugins/frontend/commands/implement.md, line 236
npx claudish --version 2>/dev/null || echo "Claudish not found" - plugins/frontend/commands/implement.md, line 278
npm install -g claudeup@latest
and 12 more places
Changes files outside its own folder
The author does not mention this.
Found in 7 places.
Show 4 more
Connects to the internet
This is disclosed by the author in the skill's SKILL.md or README.
Found in 1 place.
Safer alternatives
Low-risk skills in the same category (design) that look related. Check that one does what you need.
Install
Paste this into your terminal. It downloads exactly the version we scanned, not whatever is newest.
if [ -e ~/.agents/skills/'browser-debugger' ] || [ -L ~/.agents/skills/'browser-debugger' ]; then echo 'A skill folder named browser-debugger already exists — not replacing it' >&2; false; else d=$(mktemp -d) && git clone --quiet --filter=blob:none --no-checkout 'https://github.com/MadAppGang/claude-code' "$d" && git -C "$d" checkout --quiet '6097ad4643f23b7645a9c99c329887b623b32e57' -- 'plugins/frontend/skills/browser-debugger' && mkdir -p ~/.agents/skills && cp -R "$d"/'plugins/frontend/skills/browser-debugger' ~/.agents/skills/'browser-debugger' && rm -rf "$d"; fi
Codex reads ~/.agents/skills directly. For Claude Code, Cursor, Copilot, Gemini CLI, Antigravity or OpenCode, also link it. For Claude Code: ln -s ~/.agents/skills/'browser-debugger' ~/.claude/skills/'browser-debugger' (other agents: ~/.cursor/skills, ~/.copilot/skills, ~/.gemini/skills, ~/.gemini/config/skills, ~/.config/opencode/skills). Or install through the finder skill, which does both.
Badge for your README
The badge for MadAppGang/claude-code shows the score of its lowest-scoring skill.
[](https://zalavijaysinh.github.io/skilltrust/repos/MadAppGang/claude-code/)
Score history
| Date | Version | Score |
|---|
| 2026-11-12 | 6097ad4 | 67 |