From skills
Maps codebase architecture, layers, dependencies, and tech debt hotspots then generates a visual HTML report with a Mermaid diagram and opens it for review.
How this skill is triggered — by the user, by Claude, or both
Slash command
/skills:analyze-repoThe summary Claude sees in its skill listing — used to decide when to auto-load this skill
Visual, end-to-end codebase audit. The core insight: seeing architecture
Visual, end-to-end codebase audit. The core insight: seeing architecture diagrammed (layers, data flow, dependency density) surfaces problems that are invisible when reading file-by-file. This skill makes the invisible visible, then asks the hard questions about what it found.
Use the Agent tool (subagent_type="explore") to map the codebase. The Explore
agent has broad read access and should answer:
Instruct the Explore agent to return structured findings in these categories:
architecture, dependencies, hotspots, patterns, metrics.
Write the report to:
$TMPDIR/repo-analysis-$(date +%Y%m%d-%H%M%S).html
See references/html-report-template.md for the full HTML template. The
report sections are:
graph TD showing layers and key edgesopen $TMPDIR/repo-analysis-$(date +%Y%m%d-%H%M%S).html
Run immediately after writing the file. The path must match exactly.
Present the top 3–5 findings in order of impact. Then enter a grilling loop:
Example grilling questions (adapt to actual findings):
fetch, SWR, and TanStack
Query. What's the current standard? New contributors will guess wrong."utils/ directory has 47 files. Is that a shared library or a junk
drawer? Files that live there because they have nowhere else to go are
tech debt in disguise."The Explore agent should be specific, not vague. Not "there are some large files" but "these 5 files are over 500 lines: [list], and they appear to handle more than one concern." Not "dependencies could be reviewed" but "module A imports from module B which imports from module A (circular dependency)."
The report's value is in the Mermaid diagram showing the real dependency structure and the findings table that forces prioritization. Both require specifics from the Explore phase.
| Need | Load |
|---|---|
| HTML template for the report, Mermaid diagram structure, CSS/JS CDN links | references/html-report-template.md |
npx claudepluginhub kriscard/skillsDeeply explores existing codebases to map architecture, data flow, domain model, API surface, dependencies, and code health using read-only SubAgents.
Analyzes codebases and generates animated HTML architecture reports with interactive diagrams visualizing system flow, components, and data paths. Useful for explaining architecture, repo overviews, or creating bespoke visual reports.
Performs deep codebase analysis for patterns, architecture, implementation details, and technical debt using codebase-analyst agent. Analyzes concepts, modules, questions, or provides overviews.