Frontend website debugging toolkit using Chrome DevTools Protocol with Playwright/WebKit fallbacks. Use this skill when: (1) Debugging CSS, HTML, or JavaScript issues on a webpage, (2) Taking screenshots to verify visual changes, (3) Inspecting DOM structure or console errors, (4) Testing responsive layouts, (5) Extracting selectors for automation, (6) Self-debugging frontend work Claude has created, (7) User says "debug this page", "check my site", "why doesn't this look right", or "fix the frontend". Supports Chrome (primary) and Safari/WebKit (via Playwright). Designed for agent-driven debugging loops.
/plugin marketplace add AnthemFlynn/ccmp/plugin install website-debug@ccmpThis skill inherits all available tools. When active, it can use any tool Claude has access to.
package.jsonreferences/css-debug.mdreferences/js-debug.mdreferences/self-debug.mdscripts/browser-close.jsscripts/browser-console.jsscripts/browser-dom.jsscripts/browser-eval.jsscripts/browser-nav.jsscripts/browser-network.jsscripts/browser-pick.jsscripts/browser-resize.jsscripts/browser-screenshot.jsscripts/browser-start.jsscripts/setup.shCreating algorithmic art using p5.js with seeded randomness and interactive parameter exploration. Use this when users request creating art using code, generative art, algorithmic art, flow fields, or particle systems. Create original algorithmic art rather than copying existing artists' work to avoid copyright violations.
Applies Anthropic's official brand colors and typography to any sort of artifact that may benefit from having Anthropic's look-and-feel. Use it when brand colors or style guidelines, visual formatting, or company design standards apply.
Create beautiful visual art in .png and .pdf documents using design philosophy. You should use this skill when the user asks to create a poster, piece of art, design, or other static piece. Create original visual designs, never copying existing artists' work to avoid copyright violations.