code-to-diagram
Analyze codebases and automatically generate architecture diagrams, flowcharts, and org charts. Uses AST parsing to map import dependencies for Python, JS/TS, Go, and Java, outputting Mermaid or SVG files. Triggered when users ask to visualize code architecture, understand dependencies, draw a flowchart, or create a module diagram from source code.
pinned to #7d70204updated 2 weeks ago
Ask your AI client: “install skills/code-to-diagram”.
Requires the metahub MCP server installed in your client. Set up MCP.
mh install skills/code-to-diagrammetahub onboarded this repo on the author's behalf.
If you own github.com/zebbern/claude-code-guide on GitHub, claim the listing to take over publishing. Your claim preserves the existing eval history and badges; only the curator label is replaced with verified-publisher on your next publish.
Stars
4,389
Last commit
2 weeks ago
Latest release
published
- #ai
- #ai-agent
- #ai-agent-tools
- #anthropic-claude
- #claude
- #claude-ai
- #claude-api
- #claude-code
- #claude-code-communication
- #claude-code-guide
- #claude-code-skills
- #claude-commands
- #claude-desktop
- #claude-mcp
- #claude-sonnet
- #code
- #mcp
- #mcp-agents
- #mcp-tools
- #vscode-extension
About this skill
Pulled from SKILL.md at publish time.
Extract import and dependency relationships from a codebase via AST parsing, and automatically generate three types of diagrams:
Evaluation report
WarningsAutomated checks the publisher passed at publish time — structure, docs, safety, and whether the artifact behaves as claimed.7d70204· 2 weeks ago
Kind-specific
31Skill: SKILL.md present
found at skills/code-to-diagram/SKILL.md · frontmatter source: SKILL.md
Skill: body content present
459 words · 3,395 chars · 10 sections · 4 code blocks
Skill: triggers declaredwarn
No `trigger` phrases in SKILL.md frontmatter
Add `trigger:` lines so Claude knows when to activate this skill — e.g. `when building MCP servers` or `for diagram creation`.
Skill: allowed-tools scope
no allowed-tools restriction (Claude may use anything)
Release history
1- releasecurrent7d70204warn2 weeks ago
Contents
Extract import and dependency relationships from a codebase via AST parsing, and automatically generate three types of diagrams:
- Architecture Diagram — Module/directory-level dependency relationships
- Flowchart — File-level import call chains
- Org Chart — Directory/file hierarchy structure
Supported languages: Python, JavaScript, TypeScript, Go, Java
Output formats: Mermaid text (.mmd) or SVG images (requires mmdc installed on the system)
Usage
Basic: Analyze an Entire Project
python3 scripts/analyze_codebase.py /path/to/project
Outputs three Mermaid diagrams to stdout and writes .mmd files to the current directory.
Specify Diagram Type
# Architecture diagram only
python3 scripts/analyze_codebase.py /path/to/project --type architecture
# Flowchart only
python3 scripts/analyze_codebase.py /path/to/project --type flowchart
# Org chart only
python3 scripts/analyze_codebase.py /path/to/project --type org
Specify Output Directory and Format
# Output to a specific directory
python3 scripts/analyze_codebase.py /path/to/project --output /tmp/diagrams
# Output as SVG (requires mmdc)
python3 scripts/analyze_codebase.py /path/to/project --format svg
# Output both Mermaid and SVG
python3 scripts/analyze_codebase.py /path/to/project --format both
Output JSON Analysis Results
python3 scripts/analyze_codebase.py /path/to/project --json
Parameters
| Parameter | Description |
|---|---|
directory | Code directory to analyze (required) |
--type, -t | Diagram type: architecture, flowchart, org, all (default: all) |
--output, -o | Output directory (default: current directory) |
--format, -f | Output format: mermaid, svg, both (default: mermaid) |
--max-files | Maximum number of files to scan (default: 500) |
--max-depth | Maximum depth for org chart (default: 4) |
--json | Output analysis results in JSON format |
How It Works
- Scan phase: Recursively traverse the directory, skipping
node_modules,.git,__pycache__, etc. - Parse phase:
- Python files: uses the
astmodule to parseimportandfrom ... importstatements - JS/TS files: uses regex to match
import,require, andexport from - Go files: uses regex to match
importstatements - Java files: uses regex to match
importstatements
- Python files: uses the
- Resolve internal dependencies: Maps import paths to actual files within the project
- Generate diagrams: Converts dependency relationships into Mermaid diagram syntax
- Render (optional): Calls
mmdc(Mermaid CLI) to render.mmdfiles as SVG
Use Cases
- Quickly understand the module structure of an unfamiliar project
- Visualize dependencies during code review
- Create architecture diagrams for technical documentation
- Detect circular dependencies or excessive coupling
- Analyze project structure before refactoring
Dependencies
- Python 3.7+ (standard library only, no extra packages needed)
- SVG output requires
@mermaid-js/mermaid-cli(optional)
Notes
- Only analyzes static import relationships; dynamic imports are not tracked
- For large projects, use
--max-filesto limit the scan scope - Mermaid diagrams with too many nodes may be hard to render; use
--typeto generate diagrams separately
Reviews
No reviews yet. Be the first.
Related
Frontend Slides
Create beautiful slides on the web using Claude's frontend skills
Guizang Ppt Skill
AI-agent Skill for generating polished HTML slide decks: editorial magazine and Swiss layouts, image prompts, social covers, and a WebGL/low-power presentation runtime.
Gpt Researcher
An autonomous agent that conducts deep research on any data using any LLM providers
mh install skills/code-to-diagram