Setup & Installation
openclaw skills install @jarekbird/mermaid
Or with the ClawHub CLI, for registry-managed skill folders outside a full OpenClaw workspace:
npx clawhub install mermaid
What This Skill Does
Converts Mermaid diagram syntax into rendered PNG, SVG, or PDF images using the mmdc CLI. Supports 12 diagram types including flowcharts, sequence diagrams, ER diagrams, and Git graphs. Output themes and resolution are configurable.
Produces image files directly from text syntax without requiring a browser or design tool.
When to use it
- Visualizing a database schema as an ER diagram
- Documenting an API authentication flow as a sequence diagram
- Mapping out a project timeline with a Gantt chart
- Rendering a system architecture overview for a README
- Generating a Git branch history diagram
Example Workflow
Here's how your AI assistant might use this skill in practice.
INPUT
User asks: draw a sequence diagram showing a login flow with JWT
AGENT
- 1Determine sequenceDiagram is the appropriate Mermaid type
- 2Write the Mermaid syntax to /tmp/mermaid-login.mmd
- 3Run mmdc -i /tmp/mermaid-login.mmd -o /tmp/mermaid-login.png -t dark -b transparent -s 2
- 4Display the rendered image to the user via Read tool
- 5Remove temp files
OUTPUT
PNG image of the login sequence diagram with dark theme