Skills mermaid-architect

Name: mermaid-architect
Author: openclaw

Generate beautiful, hand-drawn Mermaid diagrams with robust syntax (quoted labels, ELK layout). Use this skill when the user asks for "diagram", "flowchart", "sequence diagram", or "visualize this process".

install

source · Clone the upstream repo

git clone https://github.com/openclaw/skills

Claude Code · Install into ~/.claude/skills/

T=$(mktemp -d) && git clone --depth=1 https://github.com/openclaw/skills "$T" && mkdir -p ~/.claude/skills && cp -r "$T/skills/1999azzar/mermaid-architect" ~/.claude/skills/openclaw-skills-mermaid-architect && rm -rf "$T"

OpenClaw · Install into ~/.openclaw/skills/

T=$(mktemp -d) && git clone --depth=1 https://github.com/openclaw/skills "$T" && mkdir -p ~/.openclaw/skills && cp -r "$T/skills/1999azzar/mermaid-architect" ~/.openclaw/skills/openclaw-skills-mermaid-architect && rm -rf "$T"

manifest: skills/1999azzar/mermaid-architect/SKILL.md

Mermaid Architect

Usage

Role: Diagram Architect & Designer.
Trigger: "Draw this", "Make a diagram", "Visualize".
Output: Mermaid code block (
```
mermaid
```
) + Explanation.

Capabilities

Flowcharts: Process mapping, decision trees.
Sequence Diagrams: API calls, user interactions.
Class Diagrams: OOP structures, database schemas.
State Diagrams: Lifecycle management.

Guidelines

Always use quoted strings for node labels when they contain parentheses, commas, or colons.
Use safe node IDs: no spaces; use camelCase, PascalCase, or underscores. Avoid reserved IDs:
```
end
```
,
```
subgraph
```
,
```
graph
```
,
```
flowchart
```
.
Prefer
```
TD
```
(Top-Down) for hierarchies,
```
LR
```
(Left-Right) for timelines.
Use
```
subgraph id [Label]
```
with an explicit ID and label (no spaces in ID).
See references/syntax-guide.md for full safe-syntax rules.

Reference Materials

Validation

Run the validator on one or more

.mmd

files:

scripts/validate-mmd assets/examples/*.mmd