creating-mermaid-diagrams

Generate Mermaid diagrams from natural language descriptions for multiple use cases.

2|Updated May 15, 2026
One-click install
npx skills add https://github.com/mashharuki/floci-sample --skill creating-mermaid-diagrams-mashharuki
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: creating-mermaid-diagrams
Source: https://github.com/mashharuki/floci-sample/tree/main/.agents/skills/creating-mermaid-diagrams
Command: npx skills add https://github.com/mashharuki/floci-sample --skill creating-mermaid-diagrams-mashharuki

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires @mermaid-js/mermaid-cli, curl, and includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill simplifies the creation and export of Mermaid diagrams, eliminating the need for manual drawing and layout, and allows for quick visualization of complex systems and workflows.

Core Features & Use Cases

  • Generate Mermaid Diagrams: Supports 11+ diagram types, including flowcharts, sequence diagrams, class diagrams, and more.
  • Export Formats: Export diagrams to PNG, SVG, and PDF formats using mmdc CLI or Kroki API.
  • Use Case: Ideal for documenting software architecture, illustrating business processes, or creating interactive visualizations for presentations.

Quick Start

Use the creating-mermaid-diagrams skill to generate a sequence diagram for your API with the command: 'create sequence diagram "API Flow" with participants "Client", "API Gateway", "Service" and interactions "Client ->> API: Request", "API ->> Service: Process", "Service ->> API: Response", "API ->> Client: Response".'

Frequently Asked Questions about creating-mermaid-diagrams

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

FAQPage Schema
How do I generate Mermaid diagrams from plain text descriptions?

To generate Mermaid diagrams from plain text, provide a command with your text description and participants. The skill automatically parses the input and creates the diagram layout without manual drawing.

What is the best way to visualize system architecture and API documentation?

Visualizing system architecture and API documentation is best handled by generating Mermaid sequence diagrams and flowcharts from plain text. This approach eliminates manual layout and allows quick visualization of complex workflows.

Does exporting Mermaid diagrams to SVG or PNG require the mmdc CLI?

Exporting Mermaid diagrams to SVG or PNG does not strictly require the mmdc CLI. You can use the mmdc CLI for local export, or alternatively use the Kroki API to export diagrams to PNG, SVG, and PDF formats.

Can I create sequence diagrams for API flows using plain text?

Yes, you can create sequence diagrams for API flows using plain text. You define the diagram title, participants like Client and API Gateway, and their interactions, and the diagram is generated automatically.

What diagram types are supported for visualizing business processes?

For visualizing business processes, over 11 diagram types are supported, including flowcharts, sequence diagrams, and class diagrams. This allows flexible documentation of various complex systems and workflows.

Do I need curl to export Mermaid diagrams using the Kroki API?

Yes, you need curl or the mmdc CLI installed to export Mermaid diagrams. The Kroki API requires curl for making export requests, while the mmdc CLI handles local rendering directly.