Guide on creating and editing Mermaid charts safely. Use when asked to draw a diagram, flowchart, or architecture chart. Triggers on: 'mermaid', 'diagram', 'flowchart', 'visualize'.
Installation
Mit Codex oder Claude installieren Kopieren Sie diesen Prompt, fügen Sie ihn in Codex, Claude oder einen anderen Assistant ein und lassen Sie die Skill-Seite prüfen und installieren.
Guide on creating and editing Mermaid charts safely. Use when asked to draw a diagram, flowchart, or architecture chart. Triggers on: 'mermaid', 'diagram', 'flowchart', 'visualize'.
Mermaid Skill
Use this skill to quickly validate Mermaid diagrams by parsing + rendering them with the official Mermaid CLI.
Prerequisites
Node.js + npm (for npx).
First run downloads a headless Chromium via Puppeteer. If Chromium is missing, set PUPPETEER_EXECUTABLE_PATH.
Tool
Validate a diagram
./tools/validate.sh diagram.mmd [output.svg]
Parses and renders the Mermaid source.
Non-zero exit = invalid Mermaid syntax.
Prints an ASCII preview using beautiful-mermaid (best-effort; not all diagram types are supported).
If output.svg is omitted, the SVG is rendered to a temp file and discarded.
Workflow (short)
If the diagram will live in Markdown: draft it in a standalone diagram.mmd first (the tool only validates plain Mermaid files).
Write/update diagram.mmd.
Run ./tools/validate.sh diagram.mmd.
Fix any errors shown by the CLI.
Once it validates, copy the Mermaid block into your Markdown file.