Real file from a public repo · synced Sep 3, 2026
devtools
Drop-in inspector panel for any json-render app. Use when the user wants to debug a generative UI, inspect the spec tree, edit state at runtime, see dispatched actions, follow stream patches live, browse a catalog, or pick DOM elements to find their spec keys. Triggers include "add devtools", "debug json-render", "inspect the spec", "why is this element not rendering", "see the state at runtime", or requests to tap streams / capture action logs for @json-render/devtools.
Works with
Install in three steps
- 1
Download the ZIP
One file per agent, plus INSTALL.md with the exact paths below.
- 2
Claude Code: copy SKILL.md into your skills folder
.claude/skills/devtools/SKILL.md # this project ~/.claude/skills/devtools/SKILL.md # every project
- 3
Other agents: use the matching file
skill.mdc goes in Cursor’s .cursor/rules/. AGENTS.md works as GitHub Copilot instructions, a legacy .cursorrules, or a Codex / Gemini CLI instructions file.

