mermaidjs-v11

Render Mermaid.js v11 diagrams to SVG, PNG, or PDF via CLI.

Updated Feb 2, 2026
One-click install
npx skills add https://github.com/vuminhieu/spexor-client --skill mermaidjs-v11-vuminhieu
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: mermaidjs-v11
Source: https://github.com/vuminhieu/spexor-client/tree/main/.agent/skills/skills/mermaidjs-v11
Command: npx skills add https://github.com/vuminhieu/spexor-client --skill mermaidjs-v11-vuminhieu

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Mermaid.js v11 diagrams are created from text definitions but can be hard to integrate into docs pipelines; this skill streamlines that process by converting code blocks into consistent visuals.

Core Features & Use Cases

  • Diagram generation from Mermaid.js v11 syntax to SVG/PNG/PDF via CLI or programmatic rendering.
  • In-browser embedding with JavaScript API for dynamic diagrams in web apps and docs.
  • Versatile diagram types including flowchart, sequence, class, state, ER, Gantt, journey, and more for architecture and planning.

Quick Start

Create a file named diagram.mmd containing Mermaid.js v11 definitions such as: flowchart TD A-->B Then render with the CLI: mmdc -i diagram.mmd -o diagram.svg, or embed using Mermaid in HTML with mermaid.initialize({ startOnLoad: true }).

Frequently Asked Questions about mermaidjs-v11

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

FAQPage Schema
How do I render Mermaid.js v11 diagrams to SVG or PNG for technical documentation?▼

You can render Mermaid.js v11 diagrams to SVG or PNG by writing text definitions in a .mmd file and executing the mmdc CLI tool to output the desired visual format.

What is the best way to integrate Mermaid.js v11 flowcharts into a docs pipeline?▼

Integrating Mermaid.js v11 flowcharts into docs pipelines is streamlined by converting text code blocks into consistent visuals via CLI rendering or programmatic APIs.

Can I use Mermaid.js v11 for dynamic in-browser embedding in web apps?▼

Yes, you can use Mermaid.js v11 for dynamic in-browser embedding by utilizing the JavaScript API with mermaid.initialize to render diagrams directly within HTML pages.

Does the Mermaid.js v11 CLI support exporting architecture diagrams to PDF?▼

Yes, the Mermaid.js v11 CLI supports exporting architecture diagrams to PDF, SVG, and PNG formats, providing repeatable visuals for technical documentation and process maps.

What diagram types can I generate from text definitions using Mermaid.js v11?▼

You can generate versatile diagram types from text definitions including flowcharts, sequence, class, state, ER, Gantt, and journey diagrams for architecture and planning.