mermaid-スキル は何をしますか？
自然言語からMermaid図（.mmd）を生成し、検証ループで品質を確保。11種類以上の図タイプに対応し、マルチバックエンド（mmdc / Kroki）でPNG/SVG/PDF出力、マルチエージェント対応。
特徴
- 自然言語から図生成: ユーザーの記述を解析して適切なMermaid図を自動生成。
- 検証ループ: 生成された図を構文チェックし、エラーがあれば自動修正を試みる反復プロセス。
- 11種類以上の図タイプ: フローチャート、シーケンス図、クラス図、状態遷移図、ER図、ガントチャート、パイチャート、ユーザージャーニー図、その他。
- マルチバックエンド:
mmdc（Mermaid CLI）とKroki（クラウドベースのレンダリングサービス）を選択可能。 - マルチ出力形式: PNG（ラスター画像）、SVG（ベクター画像）、PDF（ドキュメント）に対応。
- マルチエージェント設計: 複数のエージェント（生成、検証、修正、出力）が協調動作。
対応図タイプ
| タイプ | 説明 | Mermaidキーワード |
|---|---|---|
| フローチャート | 処理の流れを表現 | flowchart |
| シーケンス図 | オブジェクト間の相互作用 | sequenceDiagram |
| クラス図 | クラスと関連性 | classDiagram |
| 状態遷移図 | 状態と遷移 | stateDiagram-v2 |
| ER図 | エンティティ関連 | erDiagram |
| ガントチャート | プロジェクトスケジュール | gantt |
| パイチャート | 割合の可視化 | pie |
| ユーザージャーニー図 | ユーザー体験の流れ | journey |
| 要件図 | 要件の階層構造 | requirementDiagram |
| Gitグラフ | Gitの分岐とマージ | gitgraph |
| マインドマップ | アイデアの整理 | mindmap |
環境変数
| 変数名 | 必須 | デフォルト | 説明 |
|---|---|---|---|
MERMAID_BACKEND | いいえ | mmdc | 使用するバックエンド（mmdc または kroki） |
MERMAID_OUTPUT_FORMAT | いいえ | png | 出力形式（png、svg、pdf） |
KROKI_URL | Kroki使用時 | https://kroki.io | KrokiサービスのURL |
MMDC_PATH | いいえ | mmdc | mmdc実行ファイルのパス |
インストール
前提条件
- Node.js (v14以上) と npm / yarn
- Mermaid CLI（mmdcを使用する場合）:
npm install -g @mermaid-js/mermaid-cli
- またはKrokiサービスへのアクセス（Krokiを使用する場合）
スキルの追加
このスキルをAIエージェント（Claude Code、Cursor、Codexなど）に追加するには、以下の設定を行います。
# Claude Codeの場合
claude add-skill https://github.com/Agents365-ai/mermaid-skill
使用方法
- エージェントに「フローチャートを作成して」などと自然言語で指示します。
- エージェントが自動的にMermaid記法で図を生成し、検証します。
- 図が正しければ、指定された形式（PNG/SVG/PDF）で出力します。
- エラーがあれば、検証ループが自動修正を試みます。
使用例
ユーザー: ユーザーログインフローを示すフローチャートを作成して。
エージェント: 以下のような図を生成します。
flowchart TD
A[ログインページ] --> B{認証}
B -->|成功| C[ダッシュボード]
B -->|失敗| D[エラーメッセージ]
D --> A
動作の流れ（マルチエージェント）
- 生成エージェント: 自然言語からMermaid記法を生成。
- 検証エージェント: 構文チェックと意味検証を実行。
- 修正エージェント: エラーがあれば自動修正。
- 出力エージェント: PNG/SVG/PDFにレンダリング。
各エージェントは以下のように協調動作します:
flowchart LR
A[自然言語入力] --> B[生成エージェント]
B --> C[検証エージェント]
C -->|エラーなし| D[出力エージェント]
C -->|エラーあり| E[修正エージェント]
E --> B
D --> F[図ファイル出力]
ライセンス
MIT - 詳細は LICENSE ファイルを参照してください。
コントリビュート
プルリクエストと改善提案を歓迎します。詳細は CONTRIBUTING.md を参照してください。
サポート
問題が発生した場合は Issues に報告してください。