Setup & Installation
openclaw skills install @1999azzar/mermaid-architect
Or with the ClawHub CLI, for registry-managed skill folders outside a full OpenClaw workspace:
npx clawhub install mermaid-architect
What This Skill Does
Generates Mermaid diagram code for flowcharts, sequence diagrams, class diagrams, and state diagrams. Enforces safe syntax rules including quoted node labels and valid node IDs to prevent rendering errors.
Enforcing quoted labels and safe node IDs avoids the syntax errors that break most hand-written Mermaid diagrams.
When to use it
- Mapping an API request/response flow as a sequence diagram
- Documenting a database schema with a class diagram
- Visualizing a CI/CD pipeline as a flowchart
- Drawing a user authentication state lifecycle
- Creating a decision tree for branching business logic
Example Workflow
Here's how your AI assistant might use this skill in practice.
INPUT
User asks: Diagram the login flow for a web app
AGENT
- 1Identifies the request as a process flow and selects flowchart type
- 2Maps steps: user submits credentials, server validates, session created or error returned
- 3Assigns safe camelCase node IDs and quotes labels containing special characters
- 4Outputs a TD-oriented Mermaid code block with a brief explanation of each node
OUTPUT
A Mermaid flowchart code block showing the login sequence from form submission to session creation or error handling