mermaid
✓使用 mermaid-cli (mmdc) 根據 mermaid 定義生成圖表和流程圖。支持主題、自定義 CSS 和各種輸出格式，包括 SVG、PNG 和 PDF。 Mermaid 支持 20 多種圖表類型，包括流程圖、序列圖、類圖、狀態圖、實體關係圖、用戶旅程、甘特圖、餅圖、象限圖、需求圖、GitGraph、C4 圖、思維導圖、時間線、ZenUML、桑基圖、XY 圖表、框圖、數據包圖、看板、架構圖、雷達圖和樹形圖。當用戶說出“創建圖表”、“製作流程圖”、“生成序列圖”、“創建美人魚圖表”、“將其可視化為圖表”、“渲染美人魚代碼”或“創建架構圖”等內容時，會觸發此技能。
SKILL.md
Mermaid is a JavaScript-based diagramming and charting tool that uses text definitions to create diagrams dynamically. This skill includes the complete official documentation from the mermaid repository.
Quick Start: Read mermaid-cli/README.md for installation and usage. Always use mermaid-cli to validate code and generate diagrams. Adjust width/height for readability (default PNGs are often too small).
Diagram Type Syntax For detailed syntax, examples, and best practices for each diagram type, refer to files in the syntax/ folder:
使用 mermaid-cli (mmdc) 根據 mermaid 定義生成圖表和流程圖。支持主題、自定義 CSS 和各種輸出格式，包括 SVG、PNG 和 PDF。 Mermaid 支持 20 多種圖表類型，包括流程圖、序列圖、類圖、狀態圖、實體關係圖、用戶旅程、甘特圖、餅圖、象限圖、需求圖、GitGraph、C4 圖、思維導圖、時間線、ZenUML、桑基圖、XY 圖表、框圖、數據包圖、看板、架構圖、雷達圖和樹形圖。當用戶說出“創建圖表”、“製作流程圖”、“生成序列圖”、“創建美人魚圖表”、“將其可視化為圖表”、“渲染美人魚代碼”或“創建架構圖”等內容時，會觸發此技能。 來源：seckatie/katies-ai-skills。
可引用資訊
為搜尋與 AI 引用準備的穩定欄位與指令。
- 安裝指令
npx skills add https://github.com/seckatie/katies-ai-skills --skill mermaid- 分類
- #文件處理
- 認證
- ✓
- 收錄時間
- 2026-02-01
- 更新時間
- 2026-02-18
快速解答
什麼是 mermaid？
使用 mermaid-cli (mmdc) 根據 mermaid 定義生成圖表和流程圖。支持主題、自定義 CSS 和各種輸出格式，包括 SVG、PNG 和 PDF。 Mermaid 支持 20 多種圖表類型，包括流程圖、序列圖、類圖、狀態圖、實體關係圖、用戶旅程、甘特圖、餅圖、象限圖、需求圖、GitGraph、C4 圖、思維導圖、時間線、ZenUML、桑基圖、XY 圖表、框圖、數據包圖、看板、架構圖、雷達圖和樹形圖。當用戶說出“創建圖表”、“製作流程圖”、“生成序列圖”、“創建美人魚圖表”、“將其可視化為圖表”、“渲染美人魚代碼”或“創建架構圖”等內容時，會觸發此技能。 來源：seckatie/katies-ai-skills。
如何安裝 mermaid？
開啟你的終端機或命令列工具（如 Terminal、iTerm、Windows Terminal 等） 複製並執行以下指令：npx skills add https://github.com/seckatie/katies-ai-skills --skill mermaid 安裝完成後，技能將自動設定到你的 AI 程式設計環境中，可以在 Claude Code 或 Cursor 中使用
這個 Skill 的原始碼在哪？
https://github.com/seckatie/katies-ai-skills