📊
無料Mermaidダイアグラムエディター
Mermaid構文でフローチャート・シーケンス図・ガントチャートなどをライブプレビューしながら記述できます。SVG・PNGとしてエクスポート可能。ブラウザ内で完全に動作します。
プレビュー
100%
入力すると図が表示されます…
ドラッグまたはスクロールで移動。ピンチ、またはCtrl+スクロールでズーム。下端をドラッグするとプレビューを縦に広げられます。
PNGスケール
💡 Mermaid 記法で図を書けます — フローチャート、シーケンス図、ガントチャート、クラス図など — SVG や PNG で書き出せます。すべてブラウザー内で動作し、図のテキストはアップロードされません。Mermaid の描画エンジンも外部 CDN ではなくこのサイトから配信しています。
主な用途
- フローチャートを作成するテキストからフローチャートを作成し、画像としてエクスポートする。
- シーケンス図を描画するシステムまたは人がどのように時間とともにやり取りするかを図解する。
- READMEに図を追加するGitHubがREADMEで自動的にレンダリングする図を作成する。
- ガントチャートを作成するプロジェクトタイムラインをテキストからガントチャートとして配置する。
- クラス図を作成するソフトウェア設計のためにクラスとその関係を図解する。
使い方
Mermaidを使うと、図をテキストとして書くだけで自動的に描画されます — 図をバージョン管理で保持するのに最適です。これは、入力しながらリアルタイムで描画するライブエディターです。
- 1MermaidエンジンがロードされますMermaid ライブラリは、初めてツールを使うときに LibraTool から読み込まれ、その後はブラウザにキャッシュされます。
- 2図コードを書き込みますフローチャート、シーケンス図、ガントチャート、クラス図、円グラフなど。Mermaidのテキスト構文を使用します。
- 3ライブでレンダリングされますコードは解析され、入力時にブラウザのSVGにレンダリングされます。明るいテーマと暗いテーマ付き。
- 4SVGまたはPNGをエクスポート図をスケーラブルSVGまたは2倍のPNGとしてダウンロードして、ドキュメント、スライド、またはREADMEにドロップします。
図コード(内部システムについての説明がある場合があります)はブラウザで完全にレンダリングされ、アップロードされません。