charts-flow
✓Create and manage Mermaid architecture diagrams with automatic SVG generation
Installation
SKILL.md
The charts-flow skill automates creation and management of Mermaid diagrams for technical documentation. It separates diagram source files from main documents to improve rendering performance, provides automatic SVG conversion for human viewing, and maintains traceability between parent documents and diagram files.
| Parent File Path | Absolute path to main document | {projectroot}/docs/PRD/PRD-01multiagentsystemarchitecture.md | | Diagram Description | Short name for diagram | 3tieragenthierarchy | | Diagram Type | Architecture diagram type | flowchart, sequence, class, state, component, deployment |
| Migration Mode | Extract existing diagrams from document | false (create new) | | Diagram Title | Human-readable title | Derived from description | | Styling Preferences | Color scheme, layout direction | Project defaults |
Create and manage Mermaid architecture diagrams with automatic SVG generation Source: vladm3105/aidoc-flow-framework.
Facts (cite-ready)
Stable fields and commands for AI/search citations.
- Install command
npx skills add https://github.com/vladm3105/aidoc-flow-framework --skill charts-flow- Category
- </>Dev Tools
- Verified
- ✓
- First Seen
- 2026-02-01
- Updated
- 2026-02-18
Quick answers
What is charts-flow?
Create and manage Mermaid architecture diagrams with automatic SVG generation Source: vladm3105/aidoc-flow-framework.
How do I install charts-flow?
Open your terminal or command line tool (Terminal, iTerm, Windows Terminal, etc.) Copy and run this command: npx skills add https://github.com/vladm3105/aidoc-flow-framework --skill charts-flow Once installed, the skill will be automatically configured in your AI coding environment and ready to use in Claude Code or Cursor
Where is the source repository?
https://github.com/vladm3105/aidoc-flow-framework
Details
- Category
- </>Dev Tools
- Source
- skills.sh
- First Seen
- 2026-02-01