skills.rest
tedtv1007-ctrl
tedtv1007-ctrlCOMMUNITY
Explore all skills by this author →
GitHub

diagram-gen

Generate Mermaid-compatible architecture diagrams from source code structure.

Updated Mar 26, 2026
Search Tags:#architecture#code analysis#documentation#mermaid#visualization#diagram
One-click install
npx skills add https://github.com/tedtv1007-ctrl/milk-skills-library --skill diagram-gen-tedtv1007-ctrl
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: diagram-gen
Source: https://github.com/tedtv1007-ctrl/milk-skills-library/tree/main/diagram-gen
Command: npx skills add https://github.com/tedtv1007-ctrl/milk-skills-library --skill diagram-gen-tedtv1007-ctrl

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This tool solves the problem of outdated architecture documentation by automatically generating accurate, visual representations directly from your source code.

Core Features & Use Cases

  • Automated Visualization: Generates flowcharts, class diagrams, sequence diagrams, and ER diagrams.
  • Markdown Integration: Outputs standard Mermaid syntax that renders natively in GitHub and most documentation platforms.
  • Use Case: When onboarding a new developer to a complex repository, use this tool to generate a sequence diagram of the core authentication flow to provide immediate visual clarity.

Quick Start

Run the diagram generator on the current directory to create a flowchart of the codebase structure.

Frequently Asked Questions about diagram-gen

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I generate architecture diagrams from source code automatically?▼

You can generate architecture diagrams from source code by analyzing structure and relationships to produce Mermaid syntax supporting flowcharts, class diagrams, sequence diagrams, and ER models rendered natively in GitHub.

What types of diagrams can I create for code analysis and documentation?▼

For code analysis and documentation, you can generate flowcharts, class diagrams, sequence diagrams, and entity-relationship models using standard Mermaid syntax that renders natively in GitHub and most documentation platforms.

Do I need an OpenAI API key to generate Mermaid diagrams from my codebase?▼

Yes, you need an active OpenAI API key and Node.js 18+ to interpret code logic and produce accurate Mermaid diagram syntax for your architecture documentation.

Does Mermaid diagram syntax render natively in GitHub markdown documentation?▼

Yes, Mermaid diagram syntax renders natively in GitHub and most documentation platforms, allowing you to embed generated flowcharts, sequence diagrams, and ER models directly into markdown files.

What's the best way to visualize a complex authentication flow for new developers?▼

The best way to visualize an authentication flow for onboarding developers is to generate a sequence diagram from source code, providing immediate visual clarity of core logic and relationships for documentation.

Related Skills

Explore More Software Engineering Skills→
x85446x85446

tui-runner

Install and configure the terminal-mcp server for headless terminal emulation in Claude Code.

Community
Advanced
jgezelscorpjgezelscorp

mermaid

Generate Mermaid diagrams for markdown documentation with theming and dark mode.

Community
Intermediate
agnaldo4jagnaldo4j
1

c4-model

Generate synchronized C4 architecture diagrams in Mermaid syntax from source code analysis.

Community
Advanced
anderson-0anderson-0
4

architecture-map

Generate Mermaid architecture diagrams from source code with dependency analysis.

Community
Advanced