From agentspec
Generates self-contained HTML pages for diagrams, slide decks, visual plans, code reviews, and more. Supports sharing to Vercel for live URLs.
How this command is triggered — by the user, by Claude, or both
Slash command
/agentspec:READMEvisual-explainer/The summary Claude sees in its command listing — used to decide when to auto-load this command
# Visual Explainer Commands > **8 slash commands** for generating self-contained HTML pages — diagrams, slides, plans, reviews, and live sharing ## Command Catalog | Command | Purpose | |---------|---------| | `/generate-web-diagram` | Generate a standalone HTML diagram for any topic | | `/generate-slides` | Magazine-quality slide deck as HTML | | `/generate-visual-plan` | Visual implementation plan with flow diagrams | | `/diff-review` | Before/after architecture comparison with code review | | `/plan-review` | Current codebase vs. proposed plan with risk assessment | | `/project-recap`...
8 slash commands for generating self-contained HTML pages — diagrams, slides, plans, reviews, and live sharing
| Command | Purpose |
|---|---|
/generate-web-diagram | Generate a standalone HTML diagram for any topic |
/generate-slides | Magazine-quality slide deck as HTML |
/generate-visual-plan | Visual implementation plan with flow diagrams |
/diff-review | Before/after architecture comparison with code review |
/plan-review | Current codebase vs. proposed plan with risk assessment |
/project-recap | Project state, decisions, and cognitive debt snapshot |
/fact-check | Verify document accuracy against actual codebase |
/share | Deploy an HTML page to Vercel and get a live URL |
# Generate a diagram
/generate-web-diagram "Data pipeline architecture"
# Create a slide deck
/generate-slides "AgentSpec overview for stakeholders"
# Review a diff visually
/diff-review main
# Share a generated page
/share ~/.agent/diagrams/my-diagram.html
Each command delegates to the visual-explainer skill, which:
${CLAUDE_PLUGIN_ROOT}/skills/visual-explainer/.html file with no external dependencies~/.agent/diagrams/ for persistence across sessionsOutput files are single HTML files — no build step, no server required. Share them with /share.
npx claudepluginhub luanmorenommaciel/agentspec --plugin agentspec/generate-slidesGenerates a magazine-quality slide deck as a self-contained HTML page with narrative arc, visuals, diagrams, and varied layouts.
/visualsAnalyzes Slidev presentation slides.md and enhances slides with Mermaid, PlantUML, Excalidraw diagrams, images, and AI prompts per best practices.
/awesome-docsGenerates animated Markdown documents with GitHub-safe SVG diagrams. Also supports converting, updating, diffing, auditing, previewing, and exporting existing docs.
/archflow-slidesAnalyzes the current codebase and generates a scroll-snap HTML architecture slide deck with animated diagrams, components, data flow, external services, and insights.
/generate-visualizationsGenerates Mermaid diagrams, data charts, token comparisons, and hero images for Medium articles and technical documentation from paths or themes.
/pageGenerates a single comprehensive wiki page for a codebase topic, tracing actual code paths with source citations, Mermaid diagrams, and first-principles explanations in VitePress Markdown.