Visual Review
ai-dynamo/dynamo
Create self-contained interactive HTML code-review dashboards from GitHub or GitLab pull requests, checked-out branch diffs, or supplied unified diffs, with correctness and safe-to-merge scores…
Create or refine readable Mermaid diagrams for changes, architecture, lifecycles, and dependencies in Markdown documents and PR descriptions.
Install Mermaid Diagrams
$ npx skills add openclaw/openclaw-enterprise --skill mermaid-diagrams -a claude-codeProject install by default; add -g for ~/.claude/skills/.
$ gh skill install openclaw/openclaw-enterprise mermaid-diagrams --agent claude-codeProject scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).
$ git clone --depth 1 https://github.com/openclaw/openclaw-enterprise.git skills-src && mkdir -p .claude/skills && cp -r skills-src/.agents/skills/mermaid-diagrams .claude/skills/mermaid-diagrams && rm -rf skills-srcUse ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.
Claude Code skills documentation · loads skills from .claude/skills/
Install the "mermaid-diagrams" agent skill from https://github.com/openclaw/openclaw-enterprise/tree/main/.agents/skills/mermaid-diagrams into .claude/skills/mermaid-diagrams/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "mermaid-diagrams", then confirm the skill loads.Claude Code copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$skill-installer install https://github.com/openclaw/openclaw-enterprise/tree/main/.agents/skills/mermaid-diagramsType this inside Codex. $skill-installer <name> installs a curated skill from openai/skills. The installer writes to $CODEX_HOME/skills (default ~/.codex/skills). Restart Codex if the skill does not show up.
$ npx skills add openclaw/openclaw-enterprise --skill mermaid-diagrams -a codexProject install goes to .agents/skills/; add -g for ~/.codex/skills/.
$ gh skill install openclaw/openclaw-enterprise mermaid-diagrams --agent codexProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/openclaw/openclaw-enterprise.git skills-src && mkdir -p .agents/skills && cp -r skills-src/.agents/skills/mermaid-diagrams .agents/skills/mermaid-diagrams && rm -rf skills-srcUse ~/.agents/skills/ instead of .agents/skills for a personal install.
Codex skills documentation · loads skills from .agents/skills/
Install the "mermaid-diagrams" agent skill from https://github.com/openclaw/openclaw-enterprise/tree/main/.agents/skills/mermaid-diagrams into .agents/skills/mermaid-diagrams/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "mermaid-diagrams", then confirm the skill loads.Codex copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add openclaw/openclaw-enterprise --skill mermaid-diagrams -a cursorProject install goes to .agents/skills/; add -g for ~/.cursor/skills/.
$ gh skill install openclaw/openclaw-enterprise mermaid-diagrams --agent cursorProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/openclaw/openclaw-enterprise.git skills-src && mkdir -p .cursor/skills && cp -r skills-src/.agents/skills/mermaid-diagrams .cursor/skills/mermaid-diagrams && rm -rf skills-srcUse ~/.cursor/skills/ instead of .cursor/skills for a personal install.
Cursor skills documentation · loads skills from .cursor/skills/, .agents/skills/, .claude/skills/, .codex/skills/
Install the "mermaid-diagrams" agent skill from https://github.com/openclaw/openclaw-enterprise/tree/main/.agents/skills/mermaid-diagrams into .cursor/skills/mermaid-diagrams/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "mermaid-diagrams", then confirm the skill loads.Cursor copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ gemini skills install https://github.com/openclaw/openclaw-enterprise.git --path .agents/skills/mermaid-diagrams--scope user (default) or --scope workspace; --path is the subfolder of the repo that holds the skill; --consent skips the security confirmation prompt.
$ npx skills add openclaw/openclaw-enterprise --skill mermaid-diagrams -a gemini-cliProject install goes to .agents/skills/; add -g for ~/.gemini/skills/.
$ gh skill install openclaw/openclaw-enterprise mermaid-diagrams --agent gemini-cliProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/openclaw/openclaw-enterprise.git skills-src && mkdir -p .gemini/skills && cp -r skills-src/.agents/skills/mermaid-diagrams .gemini/skills/mermaid-diagrams && rm -rf skills-srcUse ~/.gemini/skills/ instead of .gemini/skills for a personal install, then run /skills reload.
Gemini CLI skills documentation · loads skills from .gemini/skills/, .agents/skills/
Install the "mermaid-diagrams" agent skill from https://github.com/openclaw/openclaw-enterprise/tree/main/.agents/skills/mermaid-diagrams into .gemini/skills/mermaid-diagrams/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "mermaid-diagrams", then confirm the skill loads.Gemini CLI copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ gh skill install openclaw/openclaw-enterprise mermaid-diagramsInstalls for Copilot at project scope by default; add --scope user for a personal install. Preview a skill first with gh skill preview. Needs GitHub CLI 2.90.0 or later (public preview).
$ npx skills add openclaw/openclaw-enterprise --skill mermaid-diagrams -a github-copilotProject install goes to .agents/skills/; add -g for ~/.copilot/skills/.
$ git clone --depth 1 https://github.com/openclaw/openclaw-enterprise.git skills-src && mkdir -p .github/skills && cp -r skills-src/.agents/skills/mermaid-diagrams .github/skills/mermaid-diagrams && rm -rf skills-srcUse ~/.copilot/skills/ instead of .github/skills for a personal install. Commit .github/skills so cloud agent and code review can use it.
GitHub Copilot skills documentation · loads skills from .github/skills/, .claude/skills/, .agents/skills/
Install the "mermaid-diagrams" agent skill from https://github.com/openclaw/openclaw-enterprise/tree/main/.agents/skills/mermaid-diagrams into .github/skills/mermaid-diagrams/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "mermaid-diagrams", then confirm the skill loads.GitHub Copilot copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add openclaw/openclaw-enterprise --skill mermaid-diagrams -a opencodeOpenCode documents no install command of its own. Project install goes to .agents/skills/; add -g for ~/.config/opencode/skills/.
$ gh skill install openclaw/openclaw-enterprise mermaid-diagrams --agent opencodeProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/openclaw/openclaw-enterprise.git skills-src && mkdir -p .opencode/skills && cp -r skills-src/.agents/skills/mermaid-diagrams .opencode/skills/mermaid-diagrams && rm -rf skills-srcUse ~/.config/opencode/skills/ instead of .opencode/skills for a personal install.
OpenCode skills documentation · loads skills from .opencode/skills/, .claude/skills/, .agents/skills/
Install the "mermaid-diagrams" agent skill from https://github.com/openclaw/openclaw-enterprise/tree/main/.agents/skills/mermaid-diagrams into .opencode/skills/mermaid-diagrams/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "mermaid-diagrams", then confirm the skill loads.OpenCode copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
Facts
- Skill name
mermaid-diagrams- GitHub stars
- 390
- Token cost
- ~1.1k tokens
- SKILL.md length
- 550 words
- Files
- 2 (incl. references)
- Skills in repo
- 9
- Repo updated
- First seen
- Licence
- MIT
At a glance
Create or refine readable Mermaid diagrams for changes, architecture, lifecycles, and dependencies in Markdown documents and PR descriptions.
- Tasks that involve Pull requests
- SKILL.md covers Establish the meaning, Draw compactly and Verify and report
- Instructions only: no scripts, shell commands, URLs or credentials in SKILL.md
- Tasks that involve Diagrams
What it does
Mermaid Diagrams is an agent skill from openclaw/openclaw-enterprise. Create or refine readable Mermaid diagrams for changes, architecture, lifecycles, and dependencies in Markdown documents and PR descriptions.
Its SKILL.md is about 1.1k tokens, which your agent loads only when the skill is triggered. The skill folder holds 2 other files, including reference files (for example `references/flowchart-template.md`).
It sits in Development, covering Pull requests and Diagrams. The repository describes itself as: The Enterprise-grade Control Plane for modern agentic workloads. The licence is MIT.
When your agent uses it
- Tasks that involve Pull requests
- Tasks that involve Diagrams
Example prompts
- “/mermaid-diagrams”
What it can do on your machine
Read from SKILL.md and the folder at commit 97346cf. It shows what the files ask for, not the result of running them.
Tool permissions
Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.
From allowed-tools in the SKILL.md frontmatter.
Runs code
No scripts in the folder and no shell commands in SKILL.md.
From the folder's file list and the shell code blocks in SKILL.md.
Network
No URLs in SKILL.md.
From URLs in SKILL.md, links to its own repository left out.
Credentials
Names no API keys, tokens, secrets or passwords.
From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.
Context cost
Mermaid Diagrams loads about 1.1k tokens when it runs, and up to ~1.7k if it reads all its reference files. Until then it costs about 40 tokens; SKILL.md has 550 words of instructions outside code blocks.
Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.
Safety
Auto-check passed
The automated check found no risky patterns in SKILL.md.
Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.
SKILL.md
The full file from openclaw/openclaw-enterprise at commit 97346cf, republished under its MIT licence (© openclaw). 550 words, ~1,121 tokens.
Download SKILL.mdSave it as
.claude/skills/mermaid-diagrams/SKILL.md (or your agent's skills folder). This skill also uses 1 other file; get the full folder from GitHub.- name
- mermaid-diagrams
- description
- Create or refine readable Mermaid diagrams for changes, architecture, lifecycles, and dependencies in Markdown documents and PR descriptions.
Mermaid diagrams
Use a diagram when relationships, phases, or boundaries are easier to understand visually. Keep the surrounding explanation short. A simple edit or single fact usually needs only prose.
Establish the meaning
- Check the relevant implementation or design before drawing. State whether the diagram describes current behavior, a proposal, or a before/after comparison.
- Show the important relationships and major boundaries, not every function. Name subgraphs for the phases or boundaries they explain.
- Use solid arrows for implemented connections and dashed arrows for pending or unconnected integration. Label arrows with short verbs or conditions. Express asynchronous behavior in words rather than repurposing dashed arrows.
- Make blockers, missing connections, and out-of-scope work explicit. A proposed connection stays dashed even when its components already exist.
- Match claims to the evidence: implemented source does not by itself prove a working deployment. If that distinction matters, include it in the diagram or its caption. Do not infer a completed path from neighboring components.
Draw compactly
Use a native Markdown mermaid code block. Prefer flowchart TB; choose another
diagram type when it better explains the relationship, such as sequence order.
Keep any alternate notation's meaning clear in the caption.
For flowcharts, start from the flowchart template. Its sample behavior is illustrative; replace its nodes and connections with the actual subject.
- Enable
htmlLabels: truein Mermaid's YAML frontmatter. - Give nodes short bold headings with
<b>...</b>and separate supporting lines with<br/>. Aim for roughly 15–25 characters per line and 2–3 lines per node where practical. Preserve precise names when shortening would obscure meaning. - Avoid long single-line labels, fixed-width HTML containers, complex inline CSS, and excessive text. Split an overfull diagram into focused views.
- Use muted, desaturated fills with dark labels and thin borders; start with
1px strokes. Keep phase outlines neutral so they do not compete with the nodes.
Define reusable
classDefstyles and reinforce color with words and line styles. - Start with 14–16px text and balanced spacing. Set
subGraphTitleMarginseparately from nodepaddingso phase headings have room above their nodes. TunenodeSpacingandrankSpacingrather than adding empty label lines. - Align parallel phases when practical. An extra hyphen on an existing solid
arrow (
--->) can span another layout rank without adding a relationship. Keep its meaning and endpoints unchanged; avoid inventing edges to force layout.
Show full SKILL.md (170 more words)Show less
| Color | Meaning |
|---|---|
| Blue | APIs, configuration, persisted state |
| Purple | Operator inputs, secrets, external dependencies |
| Teal | Processing, protected operations, implemented capabilities |
| Amber | Gates, blockers, conditions requiring attention |
| Gray with a dashed border | Pending or out-of-scope integration |
Verify and report
Check that every edge reflects the relevant evidence and that labels distinguish implemented behavior from pending work. Keep confidential details out of diagrams destined for a public document or PR, just as in the surrounding text.
When available, render at the intended document width and inspect label contrast, phase-title clearance, node padding, large empty areas, and confusing crossings. Compare before/after views at the same viewport; a narrower SVG may be enlarged by its viewer. Prefer the destination's renderer; local rendering can differ from the published result. Adjust labels or layout when needed.
Report validation precisely: reviewing source text, passing a Mermaid syntax check, and visually inspecting a rendered diagram are separate checks. If rendering is unavailable, say so; do not describe the diagram as visually verified. Diagram checks do not establish runtime behavior.
© openclaw, MIT. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file
Files
SKILL.md and 1 other file (references) in .agents/skills/mermaid-diagrams of openclaw/openclaw-enterprise.
- SKILL.md
- references/flowchart-template.md
Open the folder on GitHubat commit 97346cf
Compare with similar skills
Mermaid Diagrams next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.
| Skill | Stars | Used in | Tokens | Auto-check | Licence | Repo updated |
|---|---|---|---|---|---|---|
| Mermaid Diagrams this skillopenclaw/openclaw-enterprise | 390 | — | ~1.1k | Automated safety check: Pass | MIT | |
| Visual Reviewai-dynamo/dynamo | 8.3k | — | ~4.5k | Automated safety check: Pass | Apache-2.0 | |
| Eli5coldteadotai/pr-lens | 1.9k | — | ~2.3k | Automated safety check: Pass | MIT | |
| PR Lenscoldteadotai/pr-lens | 1.9k | — | ~398 | Automated safety check: Pass | MIT | |
| CodeScope Codebase Graph AnalysisQwenLM/qwen-code | 28k | 1 repos | ~9.3k | Automated safety check: Pass | Apache-2.0 | |
| Submit BranchZenUml/web-sequence | 150 | — | ~765 | Automated safety check: Pass | MIT |
Similar skills
Eli5
coldteadotai/pr-lens
WHAT: Explains a codebase, a folder, a feature, a command or a pull request to someone who knows nothing about it, as a PR Lens canvas whose walkthrough builds the picture one part at a time.
PR Lens
coldteadotai/pr-lens
WHAT: Draws a code change or part of a codebase as an animated architecture or data-flow diagram, on its own or in a pull request.
CodeScope Codebase Graph Analysis
QwenLM/qwen-code
Answers questions about code structure, history, bugs and PR risk using a CodeScope knowledge graph and semantic index built from the repository.
Submit Branch
ZenUml/web-sequence
Push the current ZenUML web-sequence branch, create or reuse a GitHub PR against master, then always run babysit-pr until CI is green or blocked.
PR Description
dxos/dxos
Write or rewrite a pull request description from literal section templates — summary and safety (always), bugfix, architecture, and UI — so every PR body has the same headings, tables and line…
More from openclaw/openclaw-enterprise
All 9 skills in this repoLocal Dev
openclaw/openclaw-enterprise
Develop OpenClaw Enterprise changes with proportional verification and source-backed flow documentation for non-trivial behavior.
Technical Writing
openclaw/openclaw-enterprise
Write, organize, name, edit, or review Enterprise developer documentation, specifications, and technical instructions; ground claims in current source and finish with a plain-language cleanup.
Enterprise Testing
openclaw/openclaw-enterprise
Select proportional Enterprise validation and diagnose exact CI runs, distinguishing product, harness, infrastructure, and credential failures.
Test Audit
openclaw/openclaw-enterprise
Gate new or changed Enterprise tests and audit existing tests for observable behavior, credible regressions, duplicate coverage, and test-only production seams.
Design Review
openclaw/openclaw-enterprise
Assess designs, public interfaces, state ownership, readability, and refactor proposals when the task calls for design review or structural simplification; not for unrelated routine edits.
Deslop
openclaw/openclaw-enterprise
Clean only the current Enterprise diff before autoreview, preserving behavior, security boundaries, required TODOs, and useful test-intent comments.
Related
Categories
Questions about Mermaid Diagrams
What does Mermaid Diagrams do?
Create or refine readable Mermaid diagrams for changes, architecture, lifecycles, and dependencies in Markdown documents and PR descriptions. Mermaid Diagrams is an agent skill from openclaw/openclaw-enterprise. Create or refine readable Mermaid diagrams for changes, architecture, lifecycles, and dependencies in Markdown documents and PR descriptions.
When should I use Mermaid Diagrams?
Mermaid Diagrams fits situations like: tasks that involve Pull requests; tasks that involve Diagrams.
How do I install Mermaid Diagrams in Claude Code?
Run `npx skills add openclaw/openclaw-enterprise --skill mermaid-diagrams -a claude-code`. Or copy the skill folder (.agents/skills/mermaid-diagrams in openclaw/openclaw-enterprise) into .claude/skills/mermaid-diagrams in your project. Claude Code loads it when a task matches its description.
How do I install Mermaid Diagrams in Codex?
Run `npx skills add openclaw/openclaw-enterprise --skill mermaid-diagrams -a codex`. Or copy the skill folder (.agents/skills/mermaid-diagrams in openclaw/openclaw-enterprise) into .agents/skills/mermaid-diagrams in your project. Codex loads it when a task matches its description.
Can I use Mermaid Diagrams in Cursor, Gemini CLI or GitHub Copilot?
Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add openclaw/openclaw-enterprise --skill mermaid-diagrams -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/mermaid-diagrams, .gemini/skills/mermaid-diagrams, .github/skills/mermaid-diagrams and .opencode/skills/mermaid-diagrams in your project.
What does Mermaid Diagrams need to run?
SKILL.md names no scripts, command-line tools or credentials: Mermaid Diagrams is instructions for the agent only.
Does Mermaid Diagrams access the network?
SKILL.md contains no URLs. Any network use would come from the scripts or tools the agent runs. This is read from the text; nothing was executed.
Is Mermaid Diagrams safe to install?
Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.
What licence does Mermaid Diagrams use?
Mermaid Diagrams is published under the MIT licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.
How many tokens does Mermaid Diagrams use?
About 1.1k tokens (SKILL.md is roughly 4.5k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full. Its references folder adds about 608 tokens, read only when the agent opens those files.
What are the alternatives to Mermaid Diagrams?
Skills that share tags, products or a category with Mermaid Diagrams: Visual Review (ai-dynamo/dynamo, 8.3k stars), Eli5 (coldteadotai/pr-lens, 1.9k stars), PR Lens (coldteadotai/pr-lens, 1.9k stars) and CodeScope Codebase Graph Analysis (QwenLM/qwen-code, 28k stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.
Who maintains Mermaid Diagrams?
openclaw (a GitHub organization) maintains it in openclaw/openclaw-enterprise, which has 390 GitHub stars. The repository holds 9 skills in this directory. The repository was last updated on October 11, 2026.
Source: openclaw/openclaw-enterprise on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.