| name | mermaid-diagrams |
| description | Create or edit a Mermaid flowchart, sequence diagram, state diagram, ERD, class diagram, timeline, or other text-native diagram. Use only when Mermaid is explicitly requested or already used in the target document; use SVG for bespoke visual composition. |
Mermaid diagrams
Represent the intended relationships with the simplest diagram type that fits.
- Define audience, question, entities, relationships, direction, and required detail.
- Choose the correct Mermaid diagram type.
- Use short stable IDs and readable labels.
- Group only meaningful subgraphs and minimize crossing edges.
- Keep styling restrained and compatible with the target renderer.
- Validate syntax in the actual Mermaid version/rendering surface and inspect readability.
Prometheus renders Mermaid on a transparent inline surface and supplies the active
Prometheus theme to Mermaid. Prefer Mermaid's semantic structure and default styling;
do not add a fixed dark/light background, a hardcoded canvas panel, or a manual theme
that fights the host. If custom styling is necessary, use transparent backgrounds,
currentColor, and the injected --prom-* tokens.
Do not force architecture, sequence, and data relationships into one overloaded diagram. Preserve existing node IDs when other documents link to them.
Read detailed-guide.md for syntax patterns, diagram selection, styling, escaping, and examples.
