AgentSkillsCN

mermaid

创建并验证Mermaid图表。当您需要在Markdown文件中创建、编辑或审阅Mermaid图表时,此工具将助您事半功倍。

SKILL.md
--- frontmatter
name: mermaid
description: Create and validate Mermaid diagrams. Use when creating, editing, or reviewing Mermaid diagrams in markdown files.
user-invocable: true

Mermaid Diagrams

Create and validate Mermaid diagrams with syntax checking.

Diagram Types

TypeDirectiveUse For
Flowchartflowchart TBProcess flows, decision trees, system architecture
SequencesequenceDiagramAPI interactions, message passing, protocols
StatestateDiagram-v2State machines, lifecycles, status transitions
ERerDiagramDatabase schemas, entity relationships

Validation

Validate mermaid syntax in markdown files:

bash
bun ${CLAUDE_SKILL_ROOT}/scripts/validate.ts <file.md>

References

  • Flowchart — Nodes, edges, subgraphs, layout direction
  • Sequence — Participants, messages, activations, loops
  • State — States, transitions, composite states
  • ER — Entities, relationships, cardinality

Best Practices

  • Keep labels concise—use full descriptions in surrounding prose
  • Use subgraphs to group related nodes visually
  • Order participants/nodes to minimize edge crossings
  • Prefer left-to-right (LR) for timelines, top-to-bottom (TB) for hierarchies