SKILL

mermaid-diagrams

Comprehensive guide for creating software diagrams using Mermaid syntax. Use when users need to create, visualize, or document software through diagrams including class diagrams (domain modeling, object-oriented design), sequence diagrams (application flows, API interactions, code execution), flowcharts (processes, algorithms, user journeys), entity relationship diagrams (database schemas), C4 architecture diagrams (system context, containers, components), state diagrams, git graphs, pie charts, gantt charts, or any other diagram type. Triggers include requests to "diagram", "visualize", "model", "map out", "show the flow", or when explaining system architecture, database design, code structure, or user/application flows.

Target: Design & content creation. Automatically collected · unverified.

Excerpt from the author’s documentation

Extracted from a fixed version of SKILL.md in its original language. This is the author’s documentation; installation, compatibility and runtime results have not been verified by this site.

Read the original English text

Topics in the source

  • Mermaid Diagramming
  • Core Syntax Structure
  • Diagram Type Selection Guide
  • Quick Start Examples
  • Class Diagram (Domain Model)
  • Sequence Diagram (API Flow)
  • Flowchart (User Journey)
  • ERD (Database Schema)

Create professional software diagrams using Mermaid's text-based syntax. Mermaid renders diagrams from simple text definitions, making diagrams version-controllable, easy to update, and maintainable alongside code. All Mermaid diagrams follow this pattern: Key principles: First line declares diagram type (e.g., classDiagram, sequenceDiagram, flowchart) Use %% for comments Line breaks and indentation improve readability but aren't required Unknown words break diagrams; parameters fail silently Choose the right diagram type: 1. Class Diagrams - Domain modeling, OOP design, entity relationships Domain-driven design documentation Object-oriented class structures Entity relationships and dependencies 2. Sequence Diagrams - Temporal interactions, message flows API request/response flows User authentication flows System component interactions Method call sequences 3. Flowcharts - Processes, algorithms, decision trees User journeys and workflows Business processes Algorithm logic Deployment pipelines 4. Entity Relationship Diagrams (ERD) - Database schemas Table relationships Data modeling Schema design 5. C4 Diagrams - Software architecture at multiple levels System Context (systems and u

This is an excerpt. Refer to the complete source and its current requirements.

Source repository
davila7/claude-code-templates
Source file
cli-tool/components/skills/creative-design/mermaid-diagrams/SKILL.md
Fixed revision
21be197f100a12b8d0dd9a211cc244c8179f84d3
Read the complete original documentation ↗

Requirements

  • Only the author’s Skill metadata is included. Read the full instructions to check dependencies, licensing and conditions of use.

A small first task

先阅读原作者说明,再决定是否在自己的 AI 工具中使用。

Instructions for your AI tool

Author documentation is not live verification by this site. Without evidence, we do not mark a resource as compatible, safe or free.

Sources and evidence

This record was collected automatically. Its documentation, suitability and runtime behavior have not been manually verified.

Author: davila7/claude-code-templates · original repository metadata. Documentation review: Not reviewed. Last source check: 2026-11-09T14:01:43.862Z.

Categories are inferred from names, descriptions and paths. They do not establish compatibility.

License and attribution

MIT. Third-party content and copyright remain with their authors. Refer to the original license and terms.

Original license ↗

Synchronization, copying and user-reported success do not mark a resource as runtime-tested.

Limitations and notes

  • Collecting metadata does not mean this site has installed, adapted, runtime-tested or security-reviewed the resource.