mcpField
D
drawio-architecture

drawio-architecture

github.com/afonsoftデザイン・UI1447 回インストール2 日前に更新
リポジトリ

drawio-architecture について

編集可能な draw.io のアーキテクチャ図などを作成するスキルで、図の作成と受け渡しを行うエージェントやユーザー向けです。XML の作成指針に加え、MCP の設定とローカル CLI によるエクスポートを説明します。

主な機能

  1. 01draw.io ネイティブ XML の作成
  2. 02MCP 経由で図をエディターに表示
  3. 03Mermaid と CSV の図に対応
  4. 04draw.io の図形ライブラリを検索
  5. 05MCP サーバーの設定
  6. 06PNG、SVG、PDF のローカル出力

活用シーン

  1. 01システムやクラウドの構成図作成
  2. 02フローチャートを draw.io で直接開く
  3. 03クラウドやネットワークのアイコン検索
  4. 04CLI による画像や PDF の出力

MCP 対応

公式 @drawio/mcp サーバーの設定方法と、図の表示や図形検索に使うツールを説明します。複数クライアント向けの設定補助や、ホスト型エンドポイントのデータ取り扱いに関する注意点も含みます。

インストール

コマンドをコピーしてターミナルで実行します。

$npx skills add https://github.com/afonsoft/skills --skill drawio-architecture

インストール後、Claude Code で/drawio-architectureを入力して読み込まれたか確認します。

同梱ファイル

SKILL.md と一緒にインストールされる参考資料やスクリプト。

references/
architecture-patterns.md
cloud-icons.md
mcp-config.md
mcp-tools-reference.md
mcp-tools-reference.pt-br.md
style-guide.md
usage-examples.md
usage-examples.pt-br.md
usage-guide.md
usage-guide.pt-br.md
scripts/
setup_drawio_mcp.py
validate_drawio.py

詳細

Draw.io アーキテクチャ図 + MCP 統合

draw.io のネイティブな .drawio XML 形式で、プロフェッショナルで編集可能なアーキテクチャ図を作成し、公式の draw.io MCP サーバーと統合して、図がエディターで直接開くようにします。このスキルは、実績のある 2 つの情報源を統合しています。

  1. 作成に関する知識 — アーキテクチャ図、ネットワーク図、クラウド図、フローチャート、ER 図用に正しい .drawio XML を記述する方法（Agents365-ai/drawio-skill および scarr05/claude-skills-pub より）。
  2. MCP 統合 — 公式の @drawio/mcp サーバーを設定して呼び出し、エージェントが XML をファイルに出力するのではなく、図をインラインまたはエディターで開く方法（ベンダー独自のリファレンスである jgraph/drawio-mcp より）。

セキュリティと信頼境界

  • MCP サーバーのバージョンを固定する：npx はリモートコードをダウンロードして実行できます。バージョン指定なしで npx -y @drawio/mcp を実行しないでください。npm（https://www.npmjs.com/package/@drawio/mcp）またはプロジェクトのロックファイルで確認した明示的なバージョンを指定して、`npx -y @drawio/mcp@を使用してください。インストール前にパッケージ名と公開元（JGraph /drawio`）を確認してください。
  • ローカルの stdio またはセルフホストを優先する：推奨される統合では、ローカルの stdio プロセスとして @drawio/mcp を実行します。DRAWIO_BASE_URL を使用する場合は、自分が管理し、信頼できる draw.io インスタンスを指定してください。
  • ホスト型エンドポイントの注意点：https://mcp.draw.io/mcp は、draw.io ベンダーが運営するリモート MCP Apps エンドポイントです。図の XML を受信し、インラインでレンダリングします。ベンダー、TLS 通信、およびデータの機密性が図にとって許容できる場合にのみ使用してください。機密情報や規制対象のアーキテクチャデータをホスト型エンドポイントに送信しないでください。
  • SVG/PNG のエクスポートはローカルで行われます：CLI エクスポート（drawio -x ...）はデスクトップアプリケーションをローカルで実行し、ブラウザーの URL を明示的に開かない限り、図をアップロードしません。

使用するタイミング

  • ユーザーがアーキテクチャ図／システム図／サービス図／ネットワーク図／クラウド図、フローチャート、ER 図、シーケンス図／UML クラス図、C4 モデル、または draw.io／diagrams.net の可視化を求めている場合。

  • ユーザーが、手動でインポートするためにファイルとして保存するのではなく、図をdraw.io で自動的に開くこと（MCP）を希望している場合。

  • 現在のエージェント／IDE 用にdraw.io MCP サーバーを設定しており、プラットフォームごとの正確な設定ブロックが必要な場合。

  • shape= の文字列を推測せずに、エージェントに公式シェイプライブラリ（AWS／Azure／GCP／Cisco／K8s／ブランドロゴ）を検索させたい場合。

  • ユーザーがこのスキルについて英語で質問または言及している場合（例：「/drawio-architecture を使って」「drawio-architecture を実行して」）。

  • ユーザーがポルトガル語でこのスキルについて質問または言及している場合（例：「/drawio-architecture を使って」「drawio-architecture を実行して」）。

使用しないタイミング

  • 手描き風またはホワイトボード風のカジュアルな図 → excalidraw または tldraw。
  • Git で管理し、Markdown にレンダリングする図をコードで作成する場合 → mermaid-architecture（一般向け）または plantuml（UML）。
  • 自由形式の無限キャンバスでスケッチする場合 → tldraw。

2 つの出力方法（どちらかを選ぶか、組み合わせる）

方法内容使用するタイミング
A. MCP（チャットエージェントに推奨）エージェントが MCP ツール（open_drawio_xml）を呼び出す → draw.io エディターが図を表示した状態でブラウザーのタブに開きます。ディスク上にファイルを置く必要はありません。エージェントが MCP クライアント（Claude Desktop/Code、VS Code Copilot、Cursor、OpenCode、Windsurf）の場合。「図を見せて」というワークフローに最適です。
B. ローカル CLIエージェントが .drawio ファイルを作成し、drawio -x -f png ... で PNG／SVG／PDF をローカルにエクスポートします。ヘッドレス環境／CI、画像ファイルが必要な場合、または MCP を利用できない場合。draw.io デスクトップ CLI が必要です。

どちらの方法でも、このスキルの同じ XML 作成ルールを使用します。異なるのは出力手順だけです。以下のルールで XML を生成し、open_drawio_xml（方法 A）またはローカルファイルと CLI エクスポート（方法 B）のどちらにも渡せます。

方法 A — MCP サーバー：設定と使用

A.1 サーバーを設定する

サーバーは npx @drawio/mcp（stdio）として配布されています。明示的なバージョンを固定し、ローカルで実行してください。

npx -y @drawio/mcp@<VERSION>

<VERSION> は、npm で確認した最新の安定版に置き換えてください。実行時に最新のリモートバージョンが解決されるため、npx -y @drawio/mcp をそのまま実行しないでください。

クライアントの MCP 設定で mcpServers.drawio の下に追加してください。プラットフォームごとの具体的な JSON ブロックとセルフホストについては、references/mcp-config.md を参照してください（Claude Desktop、Claude Code、VS Code .vscode/mcp.json、Cursor ~/.cursor/mcp.json、OpenCode、Windsurf、およびセルフホストインスタンス用の DRAWIO_BASE_URL 環境変数）。

ホスト型の代替手段（https://mcp.draw.io/mcp）もあります。MCP Apps プロトコル（Claude.ai、VS Code、Cursor）を介して図をインラインでレンダリングできます。インストールは不要ですが、上記の stdio サーバーとは異なる種類のサーバーであり、図の XML が draw.io ベンダーのサーバーに送信されます。機密情報を含まない図で、ベンダーのエンドポイントを信頼できる場合にのみ使用してください。

自動セットアップヘルパー

付属のヘルパーを実行して、エージェント／プラットフォームを検出し、適切な設定を自動で追加してください。

python3 scripts/setup_drawio_mcp.py --detect
python3 scripts/setup_drawio_mcp.py --target claude-code --dry-run
python3 scripts/setup_drawio_mcp.py --target vscode --global

すべての --target 値（claude-desktop、claude-code、vscode、cursor、opencode、windsurf、raw）とフラグ（--dry-run、--global、--force）については、scripts/setup_drawio_mcp.py を参照してください。

A.2 MCP ツールのリファレンス

サーバーは以下のツールを公開します。プロンプトではツール名を明示し、エージェントがファイルを手書きするのではなく MCP を使うようにしてください（「Always use the draw.io MCP tools to create diagrams.」）。

open_drawio_xml — アーキテクチャ図で最も重要なツール

ネイティブの draw.io/mxGraph XML でエディターを開きます。パラメーター：

ParamTypeRequiredNotes
contentstringYes完全な <mxfile>…</mxfile> XML（このスキルに従って作成）
lightboxbooleanNo読み取り専用表示（デフォルトは false）
darkstringNo"auto" / "true" / "false"（デフォルトは "auto"）
routingstringNo"libavoid" は、開く前に図形の周囲でコネクターを再ルーティングします（障害物を避ける直交ルーティング）
open_drawio_mermaid

Mermaid.js 図でエディターを開きます。カスタムスタイルやアイコンが不要な標準的な種類の図（フローチャート、シーケンス図、クラス図、状態遷移図、ER 図、ガントチャート、マインドマップ、サンキーチャートなど）に使用してください。Mermaid テキストを書けば、draw.io が編集可能な図としてレンダリングします。パラメーター：content（必須）、lightbox、dark。

open_drawio_csv

CSV を図（組織図、表）に変換してエディターを開きます。パラメーター：content（必須）、lightbox、dark。

search_shapes

draw.io の約 10,000 個の図形ライブラリ（AWS、Azure、GCP、Cisco、Kubernetes、P&ID、電気、BPMN など）を検索し、open_drawio_xml で使用できるすぐに使える style 文字列を返します。ブランドロゴ（react、slack、shopping cart）については draw.io アイコンサービスが補います。パラメーター：query（スペース区切りのキーワード、必須）、limit（デフォルトは 10、最大 50）。

search_shapes は、業界固有またはブランド固有のアイコンが必要な図（クラウドアーキテクチャ、ネットワークトポロジ、P&ID、K8s、BPMN の固有要素、ブランドロゴ）にのみ使用してください。基本図形を使うフローチャート／UML／ERD／組織図／マインドマップでは省略してください。

list_pages / get_page / set_page

ローカルにある複数ページの .drawio／.xml ファイルにページ単位でアクセスします。ページは 0 始まりのインデックス、正確な名前、または ID で指定します。

ToolParamsResult
list_pagespath[{index, id, name, approxSizeBytes}]
get_pagepath, pageページの <mxGraphModel> XML
set_pagepath, page, contentそのページを置き換えます（単一の <mxGraphModel>）。他のページには影響しません

A.3 レイアウトとルーティングのパス（MCP open_drawio_xml）

論理構造（ノード、エッジ、ラベル、コンテナー）を宣言します。配置は draw.io のルーターと、必要に応じたポストレイアウト処理が行います。open_drawio_xml では、次の 2 つのパスを任意で有効にできます。

  • routing: "libavoid" — ノードの位置はそのままに、エッジを図形の周囲に直交ルーティングします。ボックスを配線が貫通しないようにしたい、意図的にレイアウトしたアーキテクチャ、ネットワーク、デプロイ、スイムレーン図に使用します。
  • postLayout: "elk" — 全体を再レイアウトします（ELK の layered）。ノードを再配置し、エッジをルーティングします。方向性のある階層的なフロー（フローチャート、パイプライン、判断フロー）に最適です。左から右への配置には direction: "horizontal" を設定します。routing と併用しないでください。どちらか一方を選択します。

Mermaid の場合、複雑なフローチャート（ノードが約 20 個以上、ひし形が 3 個以上、フィードバックエッジがある、またはエンドポイントが 3 個以上）には postLayout: "elk" が必要です。単純なフローチャートと、フローチャート以外のすべての Mermaid タイプには不要です。

PATH B — ローカル CLI エクスポート（フォールバック／成果物）

まずバイナリ名を確認します（Homebrew／Linux の .deb／.rpm／AUR では drawio が標準、古いビルドでは draw.io、macOS の .app／Windows の .exe ではフルパスを使用します）。すべての図の成果物を docs/architecture/ に保存します。

# Ensure the architecture docs folder exists
mkdir -p docs/architecture

# Preview PNG (NO -e; required for vision self-check; width-capped under 2576px)
drawio -x -f png --width 2000 -o docs/architecture/diagram.png docs/architecture/diagram.drawio

# Final PNG (WITH -e; double extension keeps it editable; run repair_png after)
drawio -x -f png -e -s 2 -o docs/architecture/diagram.drawio.png docs/architecture/diagram.drawio

# SVG / PDF (final, -e safe)
drawio -x -f svg -e --embed-svg-images -o docs/architecture/diagram.svg docs/architecture/diagram.drawio
drawio -x -f pdf -e -o docs/architecture/diagram.pdf docs/architecture/diagram.drawio

-e を使った PNG エクスポートのたびに、draw.io によって切り詰められた IEND チャンクを修正します。

python3 scripts/validate_drawio.py docs/architecture/diagram.drawio.png --repair-iend

CLI を利用できない場合は、ブラウザー URL にフォールバックします（アップロードなし — XML は # フラグメントに格納されます）。

python3 scripts/setup_drawio_mcp.py --viewer-url docs/architecture/diagram.drawio        # read-only
python3 scripts/setup_drawio_mcp.py --viewer-url --edit docs/architecture/diagram.drawio # editable editor URL

Linux のヘッドレス環境に関するガイダンス（xvfb-run、--no-sandbox、--disable-gpu、HOME）の全文とフォールバックの順序については、references/mcp-config.md を参照してください。

作成 — .drawio XML のルール（どちらのパスにも共通）

これらのルールは、ベンダー自身の shared/xml-reference.md（MCP プロンプトの唯一の信頼できる情報源）と、Agents365/claude-skills-pub の作成ガイドに基づいています。XML を open_drawio_xml に渡す場合もローカルファイルに保存する場合も、必ず従ってください。

ファイルの骨格

<mxfile host="app.diagrams.net" modified="2026-01-01T00:00:00" agent="agent" version="24.0.0" type="device">
  <diagram name="Page-1" id="page1">
    <mxGraphModel dx="1200" dy="800" grid="1" gridSize="10" guides="1" tooltips="1" connect="1" arrows="1" fold="1" page="1" pageScale="1" pageWidth="1100" pageHeight="850" math="0" shadow="0">
      <root>
        <mxCell id="0" />
        <mxCell id="1" parent="0" />
      </root>
    </mxGraphModel>
  </diagram>
</mxfile>

ルール： id="0" と id="1" は必須のルートセルです。省略しないでください。ユーザー図形には id="2" 以降を使用し、一意の ID を割り当てます。最上位の図形には parent="1" を指定します。ファイルをディスクから開く場合は type="device" を設定します。

固定グリッド（すべての図で使用）

  • 列 x = col*180 + 40 （col 0 = 40、col 1 = 220、…）
  • 行 y = row*120 + 40 （row 0 = 40、row 1 = 160、…）
  • ノードサイズ：長方形 140×60、ひし形 140×80、円 60×60、ドキュメント 120×80、円柱 100×70

各ノードを (col,row) に配置します。間隔はルーターが調整します。特定の幾何学的意図がない限り、<Array as="points"> のウェイポイントや exitX/entryY のオーバーライドを手動で追加しないでください。

基本図形（頂点）


<mxCell id="2" value="Label" style="rounded=1;whiteSpace=wrap;html=1;fillColor=#dae8fc;strokeColor=#6c8ebf;" vertex="1" parent="1">
  <mxGeometry x="100" y="100" width="140" height="60" as="geometry"/>
</mxCell>


<mxCell id="3" value="Condition?" style="rhombus;whiteSpace=wrap;html=1;fillColor=#fff2cc;strokeColor=#d6b656;" vertex="1" parent="1">
  <mxGeometry x="100" y="200" width="140" height="80" as="geometry"/>
</mxCell>


<mxCell id="4" value="DB" style="shape=cylinder3;whiteSpace=wrap;html=1;fillColor=#f5f5f5;strokeColor=#666666;" vertex="1" parent="1">
  <mxGeometry x="350" y="100" width="100" height="70" as="geometry"/>
</mxCell>

エッジ（コネクター）

重要： すべてのエッジ mxCell には、展開された <mxGeometry relative="1" as="geometry" /> 子要素が必要です。自己終了型のエッジセルは描画されません。

<mxCell id="e1" value="HTTP" style="edgeStyle=orthogonalEdgeStyle;rounded=1;html=1;" edge="1" parent="1" source="2" target="3">
  <mxGeometry relative="1" as="geometry"/>
</mxCell>
  • 手動でルーティングしないでください — source／target を宣言するだけにします。ボックスの周囲にきれいな直交配線を引くには、routing:"libavoid"（MCP）を設定するか、CLI ファイルでも同様の方法を適用します。
  • 図ごとにエッジのスタイルを統一します： ER → entityRelationEdgeStyle、UML クラス → 直線（edgeStyle なし）、マインドマップ → curved=1、フローチャート／アーキテクチャ／ネットワーク → orthogonalEdgeStyle。
  • エッジラベルは短くします（1〜3 語：Yes、async、reads）。長い説明はノードのテキストか凡例ノードに移します。
  • アニメーション付きデータフロー：flowAnimation=1; を追加します。

コンテナーと入れ子構造

大きな図形の上に図形を配置するのではなく、実際の親子関係で包含します。

種類スタイル使用場面
グループ（非表示）group;pointerEvents=0;枠線も接続もない場合
スイムレーン（タイトル付き）swimlane;startSize=30;タイトルバーを表示する場合、またはコンテナー自体を接続する場合
カスタムコンテナーcontainer=1;pointerEvents=0; を追加任意の図形をコンテナーにする場合
<mxCell id="vpc" value="VPC" style="swimlane;startSize=24;fillColor=#dae8fc;strokeColor=#6c8ebf;html=1;" vertex="1" parent="1">
  <mxGeometry x="0" y="0" width="720" height="360" as="geometry"/>
</mxCell>
<mxCell id="az1" value="AZ us-east-1a" style="swimlane;startSize=24;fillColor=#fff2cc;strokeColor=#d6b656;html=1;" vertex="1" parent="vpc">
  <mxGeometry x="20" y="36" width="320" height="300" as="geometry"/>
</mxCell>
<mxCell id="web1" value="web-1" style="rounded=1;whiteSpace=wrap;html=1;" vertex="1" parent="az1">
  <mxGeometry x="30" y="40" width="120" height="60" as="geometry"/>
</mxCell>

ルール： 子要素の座標は親に対する相対座標を使用します。異なるコンテナー内のセル間をつなぐエッジには、parent="1" を指定する必要があります（指定しないと、コンテナー内に描画されてクリップされます）。コンテナー自体を接続可能にする場合を除き、すべてのコンテナーに pointerEvents=0; を指定します（その場合は swimlane が処理します）。

レイヤー構造（上から下）と左から右へのフロー

  • レイヤー構造（TB）： ユーザー／クライアント → API／インターフェイス → ビジネスロジック → データ／ストレージ。各レイヤーにはスイムレーンまたは角丸コンテナーを使用し、その中にコンポーネントを配置します。矢印でフローを示し、凡例とメタデータフッターを追加します。
  • 左から右（LR）： Source → Process → Target。postLayout:"elk" と direction:"horizontal" を使用するか（MCP）、固定グリッドに沿って列を左から右に配置します。

レイヤー構造のサービスアーキテクチャ、イベントバスを使用したマイクロサービス、クライアント／API／DB、C4-lite コンテキスト図の XML 全体例については、references/architecture-patterns.md を参照してください。

カラーパレット（意味別）

対応する塗りつぶし色と線色の組み合わせを使用します。3 つ以上の役割が登場する場合は、凡例を自動生成します（references/style-guide.md を参照）。

役割fillColorstrokeColor
サービス／クライアント#dae8fc#6c8ebf
成功／データベース#d5e8d4#82b366
キュー／判断#fff2cc#d6b656
ゲートウェイ／API#ffe6cc#d79b00
エラー／警告#f8cecc#b85450
外部／中立#f5f5f5#666666
セキュリティ／認証#e1d5e5#9673a6

クラウドプロバイダーのアイコン

AWS／Azure／GCP／Cisco／K8s には、公式アイコンを優先して使用します。MCP では search_shapes を呼び出し、返された style を貼り付けます。手書き用チートシート（AWS の shape=mxgraph.aws4.resourceIcon;resIcon=…、Azure の image=img/lib/azure2/…svg、GCP のパス）は、references/cloud-icons.md にあります。

HTML ラベル、ダークモード、タグ、レイヤー、メタデータ

  • すべてのセルスタイルに必ず html=1 を追加します。プレーンテキストには影響しませんが、HTML（<b>、<br>、<font>）の描画にはこれが必要です。
  • 改行には &#xa;（html=1 の有無を問いません）または &lt;br&gt;（html=1 が必要）を使います。\n は使わないでください。
  • 属性値内の XML 特殊文字はエスケープします：&amp; &lt; &gt; &quot;。
  • ダークモード： <mxGraphModel> に adaptiveColors="auto" を設定します。strokeColor/fillColor/fontColor="default" は自動的に適応します。反転表示が適切でない場合に限り、light-dark(light,dark) を使用します。
  • タグ（横断的なフィルター）：セルを <object id=… tags="critical v2"> で囲みます。label は value を置き換えます。
  • レイヤー（表示の切り替え）：vertex／edge のない mxCell parent="0" を使用します。
  • メタデータとプレースホルダー： <object … component="X" status="Active" placeholders="1"> を使い、label="%component% — %status%" とします。

重大：XML の整形式性

  • 図の出力に XML コメント（``）を絶対に含めないでください。 トークンを無駄にし、解析エラーの原因となる場合があります。
  • 属性値内の特殊文字をエスケープし、一意の id を必ず使用します。
  • 提出前に検証します：python3 scripts/validate_drawio.py docs/architecture/diagram.drawio

ワークフロー（推奨）

  1. 明確化（情報が不足している場合は1～3個質問します）：図の種類、出力モード（MCPで開く／ファイル＋CLI／画像）、範囲と忠実度、具体的なテクノロジー。
  2. MCP を設定（まだの場合は path A.1 / helper）— または draw.io CLI のバイナリを解決します（path B）。
  3. 計画：図形、関係、レイアウト（LR/TB）、グループ化（階層／コンテナ）、アイコンの要否。
  4. 作成：上記のルールに従って XML を作成します（または、標準的な型付き図には Mermaid を記述します）。
  5. 納品：
    • MCP → open_drawio_xml/_mermaid/_csv を呼び出します。
    • CLI → ソース .drawio を docs/architecture/<diagram-name>.drawio に書き込み、同じフォルダーに PNG/SVG/PDF をエクスポートします。必要に応じて Vision によるセルフチェックを行います。
  6. 反復：対象を絞った XML の編集（fillColor の変更、x/y の移動、ノード／エッジの追加・削除）を行い、承認されるまで繰り返します。

よくある間違い

症状対処法
エッジが描画されないEdge cell が自己終了タグになっています。<mxGeometry relative="1" as="geometry" /> を追加します
Vision API で400「Could not process image」が発生する-e を付けてエクスポートしています。-e を付けずにプレビューを再エクスポートします（-e 付きの PNG は IEND が切り詰められています。修復を実行してください）
線がボックスを突き抜けるrouting:"libavoid" を設定します（MCP）、またはウェイポイントを追加する／間隔を広げます
アイコンの代わりに空のボックスが表示されるshape=mxgraph.* の名前が間違っています。search_shapes / references/cloud-icons.md を使用します
ノード上でエッジが重なっている側面上で exitX/exitY/entryX/entryY を分散させます
HTML がそのままテキストとして表示されるスタイルに html=1 がありません
入れ子になったコンテナ間でクリップされる異なるコンテナ間のエッジには parent="1" が必要です
CJK/URL を開くと「URI malformed」が表示されるブラウザーのフォールバックでは XML に encodeURIComponent を適用する必要があります（helper が対応します）

参照資料（このスキル）

  • architecture — docs/architecture/ を管理する包括的なスキルです。図の作成をこのエンジンに振り分けます（オーケストレーターが /architecture を呼び出し、編集可能な .drawio 成果物の作成をここに委譲します）
  • references/mcp-config.md — プラットフォームごとの正確な MCP 設定 JSON、セルフホスト、ヘッドレス／CLI フォールバック、自動セットアップ、確認手順
  • references/mcp-tools-reference.md — パラメーターと例を含む MCP ツールの完全なリファレンス（en）／mcp-tools-reference.pt-br.md（pt-BR）
  • references/usage-guide.md — 設定後のスキルの使い方（en）／usage-guide.pt-br.md（pt-BR）
  • references/usage-examples.md — エンドツーエンドの使用例（en）／usage-examples.pt-br.md（pt-BR）
  • references/architecture-patterns.md — レイヤード／マイクロサービス／クライアント-API-DB／C4-lite の完全な XML 実例
  • references/cloud-icons.md — AWS / Azure / GCP アイコンの早見表
  • references/style-guide.md — パレット、タイポグラフィ、効果、凡例の生成
  • scripts/setup_drawio_mcp.py — プラットフォームの検出、MCP 設定の書き込み／ビューアー URL の生成
  • scripts/validate_drawio.py — XML の整形式チェック、構造の lint、IEND の修復

外部参照（分析対象の資料）

コメント

Markdown 対応