Mermaid ダイアグラム Previewer

テキストを入力するだけで、フローチャート・シーケンス図・ER図・クラス図などのUMLダイアグラムをリアルタイムで可視化！SVGとしてダウンロードも可能。

テンプレートから始める

mermaid code

リアルタイムプレビュー

ダイアグラムがここに表示されます

左のエディタにMermaid記法を入力してください

ノードの形

A[テキスト] → 四角

B(テキスト) → 角丸四角

C{Text} → ひし形

D((テキスト)) → 円

矢印の種類

A --> B → 実線矢印

A --- B → 実線（矢印なし）

A -->|ラベル| B → ラベル付き

A -.-> B → 点線矢印

＼新規受講生割引実施中／

React、AWS、Pythonなど、現役エンジニアから直接学べる世界最大級の動画講座。

PR: スポンサーリンク

Mermaidとは、テキストベースの記法でダイアグラムを生成するオープンソースのツールです。GitHubのREADMEやNotion、Confluenceなど、多くのプラットフォームでネイティブにサポートされており、エンジニアが仕様書や設計ドキュメントを作成する際に非常に人気があります。

法人・個人向けサポート受付中

AWSの構築、社内ネットワーク（VPN/NW）の改善、その他原因不明のITトラブルまで、現役インフラエンジニアが直接サポートします。単発でのご相談や、毎月のスポット顧問契約も可能です。