🎁 Get the FREE AI Skills Starter Guide — Subscribe →
BytesAgainBytesAgain
BytesAgain › Skills › ui-debug-methodology
🦀 ClawHub

ui-debug-methodology

by @chrsh44e

UI/前端问题调试方法论。当遇到 CSS、布局、组件行为等 UI 问题时，强制执行"先观察后动手"的调试流程，避免盲目尝试。

Versionv1.0.0
#legal
Source

Use this skill with your agent

Most visitors already have an agent. Pick your environment, install or copy the workflow, then run the smoke-test prompt above.

Manus
Task-oriented agent. Great for testing AI skills end-to-end.
Try Manus →
OpenClaw
Local-first agent. Install skills via ClawHub CLI.
Set up OpenClaw →
Claude Code
Anthropic's coding agent. Paste the prompt or SKILL.md into your session.
Claude Code docs →
Cursor
AI-powered IDE. Use the smoke-test prompt in Cursor Agent.
Open Cursor →
Continue.dev
Open-source AI code assistant. Add SKILL.md as a custom tool.
Continue docs →
Windsurf
Agentic IDE by Codeium. Paste the prompt into Cascade.
Try Windsurf →
Cline
VS Code extension for autonomous coding with MCP tools.
Cline on GitHub →
Copilot Workspace
GitHub's AI dev environment. Suitable for code-generation skills.
Copilot Workspace →

🔍 Can't find the right skill?

Search 60,000+ AI agent skills — free, no login needed.

Search Skills →

What to do next

Skills are meant to be used inside your own AI agent. Install it, run a quick smoke test, then ask your agent to apply it to your real task.

1
Install into your agentCopy the ClawHub install command and run it where your OpenClaw/agent environment is configured.
2
Run a smoke testUse the test prompt below to confirm the skill loads and understands the workflow before relying on it.
3
Use it in your own agentPaste your actual task into Manus, OpenClaw, Claude Code, Cursor, or another agent that supports skills.
I just installed the ui-debug-methodology skill. Please run a quick smoke test: explain what this skill can do, ask me for the minimum input it needs, then produce one small sample output for a realistic task.