Mermaid Diagrams

Portable Mermaid.js diagramming for architectural documentation. Not tied to any blog platform, theme, or rendering engine. Diagrams can be rendered via CLI, embedded in markdown, or served as HTML snippets.

When to Use

Load this skill when:

• Rendering C4 flowchart approximations after the C4 level and model have been chosen; use c4-diagramming for C4 modeling decisions
• Producing sequence diagrams for interaction flows
• Designing flowcharts for process documentation
• Building state/class/ER diagrams for specification
• Generating any diagram that needs to render in both agent-facing and human-facing contexts
• Reviewing whether a structurally valid Mermaid diagram is the right communication artifact for its audience and output surface

Do NOT load when:

• A plain text outline communicates the relationship more clearly than a diagram.
• The target renderer cannot execute Mermaid and no pre-rendering path is available.