mermaid

Compare original and translation side by side

🇺🇸

Original

English

🇨🇳

Translation

Chinese

Mermaid Diagrams

Mermaid 图表

Produce valid Mermaid source that communicates relationships more clearly than prose.

生成有效的 Mermaid 源代码，以比文字更清晰地表达关系。

Routing

工具选择

Choose Mermaid by default for Markdown-native diagrams.

Choose the plantuml
skill for strict UML notation, detailed C4, or

.puml

output. Install with:

npx skills add full-stack-skills/document-skills --skill plantuml

Choose the processon-diagram-generator
skill when the user explicitly wants ProcessOn or hosted editable rendering. Install with:

npx skills add full-stack-skills/document-skills --skill processon-diagram-generator

Do not ask the user to choose a tool when the context already determines a safe default.

对于 Markdown 原生图表，默认选择 Mermaid。
对于严格的 UML 符号、详细的 C4 或
```
.puml
```
输出，选择 plantuml
skill。安装命令：
```
npx skills add full-stack-skills/document-skills --skill plantuml
```
。

当用户明确需要 ProcessOn 或托管式可编辑渲染时，选择 processon-diagram-generator
skill。安装命令：

npx skills add full-stack-skills/document-skills --skill processon-diagram-generator

。

如果上下文已经能够确定安全且合适的默认工具，不要询问用户选择工具。

Workflow

工作流

Extract entities, states, decisions, messages, or dependencies from the request and available source.
Select the smallest suitable diagram type.
Generate syntactically complete Mermaid source.
Keep labels concise and quote labels containing punctuation, parentheses, or special characters.
Validate the structure and, when a Mermaid renderer is available, render it before delivery.
Save a file only when the user asks for a file or the diagram belongs in an existing document.

从请求和可用源中提取实体、状态、决策、消息或依赖关系。
选择合适且最简的图表类型。
生成语法完整的 Mermaid 源代码。
保持标签简洁，并对包含标点、括号或特殊字符的标签加引号。
验证结构；如果有可用的 Mermaid 渲染器，则在交付前进行渲染。
仅当用户要求生成文件，或图表需要放入现有文档时，才保存文件。

Diagram selection

图表选择

Need	Mermaid declaration
Process or decision	`flowchart TD` or `flowchart LR`
Calls over time	`sequenceDiagram`
State lifecycle	`stateDiagram-v2`
Type relationships	`classDiagram`
Data entities	`erDiagram`
Schedule	`gantt`
User experience	`journey`
Hierarchy	`mindmap`
Chronology	`timeline`
Lightweight architecture	`architecture-beta` or a flowchart

Load only the matching file under

examples/

when syntax details are needed. Do not load all examples.

需求	Mermaid 声明
流程或决策	`flowchart TD` 或 `flowchart LR`
随时间发生的调用	`sequenceDiagram`
状态生命周期	`stateDiagram-v2`
类型关系	`classDiagram`
数据实体	`erDiagram`
排期	`gantt`
用户体验	`journey`
层级结构	`mindmap`
时间顺序	`timeline`
轻量级架构	`architecture-beta` 或流程图

仅在需要语法细节时加载

examples/

下对应的文件。不要加载所有示例。

Authoring rules

编写规则

Give every node a stable, simple identifier.
Quote human-readable labels when they contain punctuation.
Use one direction consistently; avoid unnecessary crossings.
Represent a decision with a diamond and label outgoing branches.
Keep sequence participants and messages explicit.
Avoid styling that depends on a single renderer unless the target platform is known.
Split an unreadable diagram instead of shrinking labels or adding excessive subgraphs.
Do not encode unsupported facts merely to make the diagram look complete.

为每个节点设置稳定、简单的标识符。
对包含标点的人类可读标签加引号。
始终使用一致的方向，避免不必要的连线交叉。
使用菱形表示决策，并标注所有分支。
明确标注时序图中的参与者和消息。
除非已知目标平台，否则避免依赖特定渲染器的样式。
如果图表难以阅读，应拆分图表，而不是缩小标签或添加过多子图。
不要为了使图表看起来完整而编码未经证实的信息。

Output

输出

For inline delivery, return a fenced block:

markdown

```mermaid
flowchart LR
    A["Input"] --> B{"Valid?"}
    B -->|Yes| C["Process"]
    B -->|No| D["Reject"]
```

For file delivery, prefer

docs/diagrams/<descriptive-name>.md

unless the repository already has a diagram convention. Preserve existing files and ask before overwriting.

对于内联交付，返回一个围栏代码块：

markdown

```mermaid
flowchart LR
    A["Input"] --> B{"Valid?"}
    B -->|Yes| C["Process"]
    B -->|No| D["Reject"]
```

对于文件交付，除非仓库已经存在图表命名规范，否则优先使用

docs/diagrams/<descriptive-name>.md

。保留现有文件，并在覆盖前询问用户。

Validation checklist

验证清单

Opening declaration matches the intended diagram type.
Identifiers are valid and unique.
Labels with punctuation are quoted.
All branches, participants, and relationships are connected as intended.
Fenced Markdown blocks are closed.
The diagram renders on the user's target platform when that renderer is available.

开头声明与预期的图表类型一致。
标识符有效且唯一。
包含标点的标签已加引号。
所有分支、参与者和关系均按预期连接。
Markdown 围栏代码块已正确闭合。
如果目标平台的渲染器可用，图表能够在其上正常渲染。