/diagram

Create and validate Mermaid diagrams. Use when creating, editing, or reviewing Mermaid diagrams in markdown files.

bendrucker@bendrucker

GitHub

From plugin

bendrucker-claude See the plugin

1584 skills

shell

$ npx -y skills add bendrucker/claude --skill diagram --agent claude-code

How it fires

How this skill gets triggered: by you, by Claude, or both.

Fires itselfAuto-invocation. Claude auto-loads it when your prompt matches the work.
You can call itInvoke it directly when you want it.
Slash command/diagram

How auto-invocation works

Context preview

The summary Claude sees to decide when to auto-load this skill.

Create and validate Mermaid diagrams. Use when creating, editing, or reviewing Mermaid diagrams in markdown files.

SKILL.md

diagram.SKILL.md

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

| Type | Directive | Use For | |------|-----------|---------| | Flowchart | `flowchart TB` | Process flows, decision trees, system architecture | | Sequence | `sequenceDiagram` | API interactions, message passing, protocols | | State | `stateDiagram-v2` | State machines, lifecycles, status transitions | | ER | `erDiagram` | Database schemas, entity relationships |

Validation

Validate mermaid syntax in markdown files:

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

References

[Flowchart](./references/flowchart.md) — Nodes, edges, subgraphs, layout direction
[Sequence](./references/sequence.md) — Participants, messages, activations, loops
[State](./references/state.md) — States, transitions, composite states
[ER](./references/er.md) — Entities, relationships, cardinality