【2026年10月最新】Mermaid記法とは？書き方・使えるツール・Claude Codeで自動生成する方法

「業務フローを図解したいけど、PowerPointで箱と矢印を並べるのが地味に時間がかかる」——資料作成に携わる人なら、一度はこの悩みにぶつかったことがあるはずです。この悩みを解決する手段として、エンジニアの間で長く使われてきたのがMermaid記法です。

Mermaid記法は、テキストを書くだけでフローチャートやシーケンス図を自動生成できる記法です。この記事では、Mermaid記法の基本的な書き方、作成できる図の種類、対応ツールまでを整理します。さらに、Claude Codeを使えば、Mermaid記法の文法を覚えなくても、日本語で頼むだけで業務フロー図を自動生成できるという、弊社（株式会社GENAI）の実践知見も独自データとして公開します。

01 WHAT IS IT Mermaid記法とは？Markdownで図を描くメリット テキストを書くだけで図が完成する仕組み

Mermaid記法とは、特定の文法に従ってテキストを書くことで、フローチャートやシーケンス図などの図表を自動生成できる軽量マークアップ言語です。GitHubやNotionなど多くのツールが標準でMermaid記法に対応しており、プログラマーの間では「図解を作るための共通言語」として広く使われています。

1-1. メリット①：修正が圧倒的に楽になる

PowerPointやExcelで箱と矢印を手作業で配置した図は、1箇所の修正のために全体の位置調整が必要になることがよくあります。Mermaid記法はテキストを編集するだけで図が自動的に再構成されるため、「箱を1個増やしたら全部ズレる」という作業がなくなります。

1-2. メリット②：環境に依存しない

画像ファイルとして図を保存すると、後から編集するには元のソフト（PowerPointなど）が必要になります。Mermaid記法はテキストファイルとして保存されるため、テキストエディタさえあれば、いつでもどこでも編集できるのが大きな利点です。

1-3. メリット③：共有・再利用がしやすい

Mermaid記法のコードはテキストなので、Slackやメールでそのままコピー＆ペーストして共有できます。また、似たような図を作る際に既存のコードを少し書き換えるだけで再利用できるため、ゼロから図を作り直す手間が省けます。

1-4. なぜエンジニアの間でこれほど普及したのか

Mermaid記法がエンジニアの間で広く普及した背景には、ソフトウェア開発のドキュメントをソースコードと同じ場所（GitHub等）で一元管理したいというニーズがあります。従来、設計図はPowerPointやExcelで別管理されることが多く、コードが更新されても図が古いままという「ドキュメントの陳腐化」が頻発していました。Mermaid記法はテキストファイルとしてコードと同じリポジトリに置けるため、コードの変更と図の更新を同時に管理できるという利点が決定的でした。

この「テキストで管理する」という発想は、エンジニア以外の業務でも同じ価値を発揮します。業務マニュアルや議事録も、更新が止まって陳腐化しがちな文書の代表例だからです。

02 DIAGRAM TYPES Mermaid記法で作成できる代表的な図の種類 業務でよく使う図はほぼすべてカバーされている

Mermaid記法は、業務でよく使われる図の多くに対応しています。代表的なものを一覧で確認しましょう。

図の種類	英語名	主な用途
フローチャート	flowchart	業務プロセス、承認フロー、意思決定フロー
シーケンス図	sequenceDiagram	システム間のやり取り、処理の時系列
ガントチャート	gantt	プロジェクトのスケジュール管理
ER図	erDiagram	データベースのテーブル関係図
円グラフ	pie	比率・割合の可視化
状態遷移図	stateDiagram	システムやモノの状態変化の図示

2-1. フローチャート：業務フローの図解にもっとも頻繁に使われる

業務で最も使う頻度が高いのがフローチャートです。承認プロセス、問い合わせ対応の分岐、意思決定の条件分岐など、「次に何をするか」が条件によって分かれる業務を図解するのに適しています。

2-2. シーケンス図：やり取りの順序を示す

複数の関係者（システム、部署、担当者）の間で、どの順番でやり取りが発生するかを示すのがシーケンス図です。「お客様→営業担当→経理部門→お客様」のような、複数者間の時系列のやり取りを整理する際に有効で、業務の引き継ぎ漏れを事前に発見する用途でも使われます。

sequenceDiagram
    お客様->>営業担当: 見積依頼
    営業担当->>経理部門: 金額確認を依頼
    経理部門->>営業担当: 承認済み見積を返信
    営業担当->>お客様: 見積書を提出

このように、誰が誰に対してどんなアクションを起こしたかを、矢印と吹き出し的なテキストで時系列順に並べるだけで、業務プロセス全体の見通しが一気に良くなります。特に部署をまたぐ業務の引き継ぎルールを明文化する際に重宝します。

2-3. ガントチャート：スケジュール管理に使える

プロジェクトの各タスクがいつからいつまで実施されるかを横棒で示すのがガントチャートです。専用のプロジェクト管理ツールを使わずに、テキストだけで簡易的なスケジュール図を作りたい場合に便利で、小規模なプロジェクトであれば十分な管理ができます。

2-4. どの図を選べばいいか迷った時の判断基準

複数の図の種類があると、どれを使うべきか迷うことがあります。シンプルな判断基準として、「条件によって分岐する業務」ならフローチャート、「複数の関係者間のやり取りの順番」ならシーケンス図、「期間とタスクの管理」ならガントチャートという使い分けを押さえておけば、ほとんどの業務シーンに対応できます。実務では、まずフローチャートで全体像を描き、特定の部分だけをシーケンス図で深掘りするという組み合わせ方もよく使われます。

03 BASIC SYNTAX Mermaid記法の基本的な書き方とルール 最小限のルールを覚えるだけで図が作れる

Mermaid記法の基本ルールは、驚くほどシンプルです。フローチャートを例にすると、「箱の名前」と「矢印でどうつながるか」を書くだけで図が完成します。

3-1. コードブロックで囲む

Mermaid記法は、多くのツールで「mermaid」と指定したコードブロックの中に記述します。GitHubやNotionでは、このコードブロックを認識して自動的に図としてレンダリング（描画）してくれます。例えば、以下のようなシンプルなコードを書くだけで、「受付」から「対応」を経て「完了」に至るフローチャートが完成します。

flowchart TD
    A[受付] --> B{緊急度は高いか}
    B -->|はい| C[即時対応]
    B -->|いいえ| D[通常対応]
    C --> E[完了]
    D --> E

この短いコードだけで、「受付→緊急度の判定→対応の分岐→完了」という業務フローが図として描画されます。-->が「矢印でつなぐ」という意味、{ }がひし形（分岐）、[ ]が四角形（通常の処理）を表しています。難しい単語はなく、ほぼ日本語の箇条書きと同じ感覚で読み書きできる点が、Mermaid記法の最大の特徴です。この短さと分かりやすさこそが、エンジニアだけでなく非エンジニアにも応用できる余地を生んでいます。

3-2. ノード（箱）の形状を変える

四角・丸・ひし形など、ノード（箱）の形状を変えることで、意味を区別できます。例えば「意思決定が必要な箇所」をひし形、「開始・終了」を丸、「通常の作業」を四角で表現するのが一般的な使い方です。

記号	形状	意味の例
[テキスト]	四角形	通常の処理・作業ステップ
(テキスト)	角丸四角形	開始・終了などの端点
{テキスト}	ひし形	条件分岐・意思決定ポイント
((テキスト))	円形	イベント・特定の状態

3-3. 図の方向を調整する

図全体を「上から下」に流すか「左から右」に流すかを、簡単な指定で切り替えられます。縦長のスライドには上下方向、横長のスライドには左右方向、といった具合にレイアウトに応じて調整します。先ほどのコード例の先頭にあるflowchart TDの「TD」が「Top to Down（上から下）」を意味し、これを「LR（Left to Right）」に書き換えるだけで、図全体の向きが左右方向に変わります。

この図自体も、実はMermaid記法のフローチャートと同じ考え方で構成されています。「箱を置いて、矢印でつなぐ」という発想さえ理解すれば、複雑な業務フローも同じ要領で表現できます。

04 TOOL COMPARISON Mermaid記法を利用できる主なツールと環境 普段使っているツールが、実はすでに対応していることも多い

Mermaid記法は多くのツールで標準対応しています。すでに使っているツールが対応していれば、新しいソフトを導入する必要はありません。

ツール	対応状況	特徴
GitHub	標準対応	READMEやIssue内でコードブロックに書くだけで自動描画
Notion	標準対応	ページ内に直接Mermaidブロックを挿入できる
VS Code（拡張機能）	拡張機能で対応	プレビューを見ながらコードを編集できる
Mermaid Live Editor	専用Webツール	インストール不要。ブラウザだけで即座に試せる
Claude Code	生成・出力に対応	日本語の指示からMermaidコードを自動生成できる

4-1. まず試すなら「Mermaid Live Editor」

インストールや契約が不要なMermaid Live Editorは、ブラウザ上でコードを入力すればすぐにプレビューが表示される公式のWebツールです。「どんな図ができるのか雰囲気を知りたい」という最初の一歩に最適です。

4-2. 業務で常用するなら「Notion」「VS Code」

すでに社内でNotionを使っているなら、ページ内にそのままMermaidブロックを作成できます。開発者であればVS Codeに拡張機能を入れることで、コードを書きながらリアルタイムにプレビューを確認できる環境が作れます。

05 DO IT WITH CLAUDE CODE 【独自】Claude CodeでMermaid図を自動生成する方法 文法を覚えなくても、日本語で頼むだけで図ができる

ここが、この記事で最も伝えたい内容です。Mermaid記法の文法を覚えるのは、非エンジニアにとって決して簡単ではありません。しかし、Claude Codeを使えば、文法を一切覚えずに、日本語で業務フローを説明するだけでMermaidコードを自動生成できます。

5-1. 具体的な依頼の仕方

実際にClaude Codeへ依頼する際は、以下のような言い方で十分です。

Claude Codeはこれらの依頼に対して、Mermaid記法のコードをその場で生成します。生成されたコードはテキストなので、Mermaid Live Editorに貼り付ければ即座に図として確認できますし、NotionやGitHubに貼り付ければそのまま図として表示されます。依頼の際に「フローチャートで」「シーケンス図で」と図の種類まで指定すると、より意図に近い結果が一度で得られやすくなります。

5-2. 修正も日本語の指示だけで完結する

一度生成した図に対して、「この分岐をもう1つ追加して」「この箱の名前を変更して」といった修正も、すべて日本語の指示で完結します。Mermaid記法の文法を自分で編集する必要はなく、Claude Codeとの対話を重ねるだけで図が完成していくという体験になります。

5-3. 既存の文章（議事録・マニュアル）を図に変換する

ゼロから業務フローを説明するだけでなく、既存の文章を読み込ませて図に変換するという使い方も実務的です。例えば、長文のマニュアルや議事録をそのままClaude Codeに読み込ませ、「この手順をフローチャートにまとめて」と依頼すれば、文章を自分で分解・整理する手間をかけずに図解が完成します。これは、長文の社内規定やオペレーションマニュアルを新人向けに分かりやすく図解する際にも有効な使い方です。

06 GENAI CASE STUDY 【独自データ】GENAIの業務フロー図・議事録図解化での活用 弊社が実際にどう使っているかを公開する

弊社（株式会社GENAI）は、Claude Max 20xプラン（月額$200・約30,000円）を全社で契約し、営業・広告・経理・秘書業務・記事制作まで幅広くClaude Codeを活用しています。この中で、Mermaid記法による図解作成も日常的な業務の一部になっています。

用途	従来のやり方	Claude Code活用後
社内業務フローの文書化	PowerPointで手作業で箱と矢印を配置	口頭説明からフロー図のたたき台を即生成
営業提案書の業務フロー図	図解担当者に依頼し、完成まで数日	Claude Codeと商談メモから図を即日作成
議事録の意思決定プロセス可視化	文章のみで議事録を作成	決定事項の分岐をフローチャート化して添付

特に効果を感じているのは、営業提案書に業務フロー図を入れる作業が圧倒的に速くなった点です。以前は「お客様の業務フローをヒアリング→図解担当者に依頼→完成確認」というプロセスに数日かかっていましたが、今は商談中にヒアリングした内容をそのままClaude Codeに伝えるだけで、提案書に使える図のたたき台がその場で完成します。

また、議事録の作成でもMermaid記法を活用しています。会議で複数の選択肢を検討して1つの結論に至った場合、文章だけで経緯を説明するより、「検討した選択肢→判断基準→最終決定」という分岐をフローチャートで示す方が、後から読み返す人にとって格段に分かりやすくなります。

6-1. 図解を「作業」ではなく「思考の整理」として使う

弊社で特に実感しているのは、図を他人に見せるためだけでなく、自分自身の思考を整理するためにMermaid記法を使うという効果です。複雑な業務フローを考えている時、頭の中だけで整理しようとすると矛盾や漏れに気づきにくいものですが、Claude Codeに説明しながら図にしてもらう過程で、「あ、この分岐が抜けていた」といった気づきが自然に生まれます。図を完成させることよりも、図を作る過程で思考が整理されるという副次効果の方が、実は価値が大きいと感じることもあります。

この「図にすることで思考が整理される」効果は、1人で作業している時だけでなく、チームでの議論にも応用できます。会議の冒頭で論点をフローチャート化して共有すれば、参加者全員が同じ前提で議論を始められ、話が噛み合わないまま時間だけが過ぎるという事態を避けやすくなります。

07 CAUTIONS Mermaid記法を使う際の注意点 便利さの裏にある制約も理解しておく

Mermaid記法は便利な反面、いくつかの制約も理解しておく必要があります。

7-1. レンダリング環境に依存する

Mermaid記法のコードは、対応ツールで表示して初めて図として見えます。対応していないツール（通常のWordファイルなど）にそのままコードを貼り付けても、テキストのまま表示されてしまう点に注意が必要です。資料を納品する相手の環境が対応しているかを事前に確認しましょう。

7-2. 複雑すぎる図は手動調整が必要になることがある

要素数が非常に多い複雑な図の場合、自動レイアウトの結果が見やすい配置にならないことがあります。この場合、ノードの配置やグループ分けを手動で調整する必要が出てくるため、「シンプルな図は自動化に向いているが、複雑な図は人の目でのチェックが欠かせない」という理解を持っておくことが大切です。

7-3. 画像として納品する場合は変換作業が必要

PowerPointやPDFとして最終的な資料を納品する場合、Mermaid記法のコードをそのまま貼り付けることはできず、画像として書き出す変換作業が必要になります。Mermaid Live Editorなど多くのツールは画像エクスポート機能を備えているため、この工程自体は難しくありませんが、一手間かかる点は覚えておきましょう。

7-4. AIが生成したコードの文法ミスをどう見分けるか

Claude Codeが生成したMermaidコードが、稀に文法エラーで正しく描画されないことがあります。この場合、慌てて一から書き直す必要はなく、「このコードがエラーになっているので直して」とそのままClaude Codeに伝え返すだけで、多くのケースは自己修正されます。人間がMermaid記法の文法を1行ずつデバッグする必要はなく、エラーメッセージや「正しく表示されない」という事実だけを伝えれば十分です。

こうしたやり取りを数回繰り返すだけで、ほとんどの文法エラーや意図のズレは解消します。人間がMermaid記法の仕様書を読み込んで自分でデバッグする必要がない、という点こそが、この組み合わせの最大の価値だと言えるでしょう。

08 CONCLUSION まとめ：図解作成はもう「手作業」の時代ではない Mermaid記法×Claude Codeで、図解のハードルが一気に下がる

この記事では、Mermaid記法の基本的な仕組み、作成できる図の種類、書き方の基本ルール、対応ツールの比較、そしてClaude Codeを使った自動生成の方法と弊社GENAIの活用事例までを整理しました。最後にポイントを振り返ります。

「図解を作るのは専門的な技術が必要」という時代は終わりました。Mermaid記法という共通の土台があり、Claude Codeがその文法を代わりに書いてくれる今、非エンジニアでも業務フロー図や議事録の図解を日常的に作れる環境が整っています。弊社では、この仕組みを使って資料作成のスピードと分かりやすさを両立させています。

最後に強調したいのは、「図解の民主化」がもたらす変化の大きさです。これまで「図を描ける人」と「描けない人」の間には、デザインツールの操作スキルという壁がありました。Mermaid記法とClaude Codeの組み合わせは、この壁を実質的に取り払います。アイデアを言葉で説明できる人なら、誰でも整理された図解を手に入れられる——この変化は、資料作成の効率化という範囲を超えて、社内のコミュニケーションの質そのものを変えるポテンシャルを持っていると弊社は考えています。

資料作成の「図解」を、もっと速く・もっと手軽にしたい方へ

デザイン担当者に依頼する時間も、Mermaid記法を覚える手間も必要ありません。
弊社の実運用ノウハウをベースに、Claude Codeでの図解作成を個別にご案内します。

ここから先の進め方は、大きく2つあります。

自社で回せるようになりたい方は、AI鬼管理でClaude Code／Codexの使い方から業務設計・社内定着まで伴走を受けながら、社内に仕組みを作る道があります。

覚えるより任せたい方は、AI社員AIKATAでこの記事のような定型業務を丸ごと預ける道があります。料金は月30万円の月額定額、追加費用は0円です。

どちらが合うかは、業務量と社内体制次第です。無料相談・無料適合診断で、貴社の場合はどちらが向くかからご相談いただけます。

よくある質問

Q. Mermaid記法を使うのにプログラミングの知識は必要ですか？

A. 本格的なプログラミング知識は不要です。基本的な文法（箱の名前と矢印のつなぎ方）を覚えれば、誰でも簡単な図から作成できます。さらに、Claude Codeを使えば文法自体を覚える必要もなく、日本語の指示だけで図を自動生成できます。

Q. MermaidとPowerPointの図、どちらを使うべきですか？

A. 修正が多い業務フローや、テキストで管理したい資料にはMermaid記法が向いています。一方、デザイン性を細かく調整したい最終的な提出用資料にはPowerPointが向いています。社内のたたき台はMermaid、対外的な最終資料はPowerPointという使い分けも実務的です。

Q. Claude CodeでMermaid図を作る場合、エディタなどの追加ツールは必要ですか？

A. 最低限、生成されたMermaidコードを図として表示するツール（Mermaid Live Editor、Notion、GitHub等）が1つあれば十分です。追加の専門ソフトウェアを購入・インストールする必要はありません。

Q. Mermaid記法で作った図をPDFやPowerPointの資料に入れることはできますか？

A. できます。Mermaid Live Editorなどのツールには画像（PNG・SVG等）として書き出す機能があるため、生成した図を画像化してPowerPointやPDFに貼り付けることが可能です。

Q. 複雑な業務フローでも、Claude Codeで一度に正確な図にできますか？

A. 要素数が多い複雑なフローの場合、一度の指示で完璧な図にならないこともあります。まず大枠の図を生成してもらい、「ここに分岐を追加して」「この部分を詳しくして」と対話を重ねながら精度を上げていく進め方を推奨します。

Q. Mermaid記法に対応していないツールに貼り付けるとどうなりますか？

A. 対応していないツールでは、図ではなくMermaid記法のテキスト（コード）がそのまま表示されてしまいます。社外共有や非対応ツールへの貼り付けが必要な場合は、事前に画像として書き出してから使用することを推奨します。

Q. フローチャートとシーケンス図、議事録にはどちらを使うべきですか？

A. 会議で複数の選択肢を比較して1つの結論に至った経緯を示す場合は、条件分岐を表現しやすいフローチャートが適しています。一方、部署間や担当者間での「報告→確認→承認」のような時系列のやり取りを記録する場合は、シーケンス図の方が実態に近い形で表現できます。議事録の内容によって使い分けるのが実務的です。

Q. Claude CodeでMermaid図を作る場合、追加の料金は発生しますか？

A. 追加料金は発生しません。Mermaidコードの生成はClaude Codeの通常の対話機能の範囲内で行われるため、既に契約しているプラン（Pro・Max等）の使用量の中で利用できます。新しい専用ツールやAPIを別途契約する必要はありません。

AIAI鬼管理

AI鬼管理／AI社員AIKATAへのお問い合わせ

この記事を読んで気になった方へ。
専門スタッフが、御社に最適な
業務自動化・業務代行プランを無料でご提案します。

ご希望のサービス

お問い合わせ対象のサービス*必須 選択してください AI鬼管理（AI業務自動化の導入支援） AI社員AIKATA（業務の丸ごと代行） 両方・相談して決めたい

サービスを選択してください

---

お客様情報

会社名・屋号*必須

会社名を入力してください

業種*必須 選択してください IT・ソフトウェア 製造業 建設・不動産 小売・EC 飲食・宿泊 医療・介護 教育・研修 士業・コンサル 人材・BPO その他

業種を選択してください

お名前*必須

お名前を入力してください

メールアドレス*必須

※法人・事業用のメールアドレスでお願いします（Gmail等の個人用フリーメールは受付できません）

正しいメールアドレスを入力してください

電話番号任意

---

現在の課題について

現在感じている課題*必須

人手不足で業務が回らない 社長・経営者が現場を離れられない 定型業務に時間を取られている AIを導入したいが何から始めればいいかわからない 外注・人件費コストが高い 業務フローが属人化している 社員のITリテラシーにばらつきがある

1つ以上選択してください

効率化・自動化したい業務*必須

営業・顧客対応（CRM・メール等） 経理・請求書・入金管理 採用・人事・労務管理 マーケティング・SNS・広告運用 カスタマーサポート・問い合わせ対応 資料作成・レポート・議事録 データ入力・集計・分析 社内の情報共有・ナレッジ管理

1つ以上選択してください

上記業務に現在かけている月額コスト*必須 選択してください まだかけていない（これから検討） 〜10万円 10〜30万円 30〜50万円 50〜100万円 100万円以上 その他（自由入力）

月額コストを選択してください

その他、ご相談内容任意

---

面談日時の選択

ご希望の日時*必須

約1時間のオンライン面談（Google Meet）です

空き枠を取得中...

面談日時を選択してください

この内容で面談を予約する

予約確定後、Google Calendarの招待メールをお届けします。
しつこい営業は一切ございません。