mermaid

Generate and locally render Mermaid diagrams for chatbot flows.

5|Updated Jan 30, 2026

Search Tags:#markdown #mermaid #validation #rendering #diagram #mermaid-diagrams #chatbot-flows

Ready to run

npx skills add https://github.com/ahgraber/skills --skill mermaid-ahgraber

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: mermaid
Source: https://github.com/ahgraber/skills/tree/main/skills/mermaid
Command: npx skills add https://github.com/ahgraber/skills --skill mermaid-ahgraber

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires pyppeteer, and includes scripts (resource) and references (resource) components.

What problem does it solve?

Generate Mermaid diagrams for chatbot flows that render in Markdown chat interfaces, validate their syntax locally, and render images without calling a web service.

Core Features & Use Cases

Draft Mermaid code blocks in Markdown for flowcharts, sequence diagrams, and state diagrams.
Validate Mermaid syntax locally using the Mermaid CLI via scripts/validate_mermaid.py.
Render diagrams to SVG/PNG/PDF using scripts/render_mermaid.py for offline usage.
Use case: share a diagram in a chat interface without relying on external services.

Quick Start

Provide a Mermaid diagram snippet and I will validate and render it locally using the bundled scripts.

Frequently Asked Questions about mermaid

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

How do I validate Mermaid diagram syntax locally before sharing it?▼

You can validate Mermaid syntax locally by running the diagram code through the included scripts/validate_mermaid.py script. This checks your flowcharts and sequence diagrams using the local Mermaid CLI without calling an external web service.

Can I render Mermaid diagrams to SVG or PNG offline?▼

Yes, you can render Mermaid diagrams to SVG, PNG, or PDF offline. The included scripts/render_mermaid.py script processes your code blocks locally using the Mermaid CLI to generate image files without relying on web services.

Does generating Mermaid diagrams require installing the Mermaid CLI?▼

Yes, generating and validating diagrams requires the Mermaid CLI (mmdc) installed on your PATH. The Skill relies on pyppeteer and the local mmdc executable to process syntax and render outputs directly on your machine.

How do I create flowcharts for chatbot flows in Markdown?▼

You can create flowcharts for chatbot flows by drafting inline Mermaid code blocks in Markdown. The Skill processes your text requests to generate flowcharts, sequence diagrams, and state diagrams suitable for rendering in chat interfaces.

What is the best way to share a sequence diagram in a chat interface?▼

The best way to share a sequence diagram in a chat interface is to use inline Mermaid code blocks. This allows Markdown chat interfaces to render the diagram directly, or you can use local scripts to render it to an image file first.

Why does my local Mermaid rendering fail when processing state diagrams?▼

Local Mermaid rendering fails if the Mermaid CLI (mmdc) is not on your system PATH. Ensure mmdc and its pyppeteer dependency are correctly installed so the validation and rendering scripts can execute properly.