Excalidraw MCP サーバー: LLM 統合のための強力な描画 API

Excalidrawのダイアグラムや描画とのシームレスなインタラクションを可能にする、包括的なモデルコンテキストプロトコル（MCP）サーバーです。このサーバーは、構造化された開発者フレンドリーなAPIを通じて、LLM（大規模言語モデル）にExcalidraw描画の作成、変更、クエリ、操作機能を提供します。

特徴

• 完全なExcalidraw要素コントロール
  以下のサポートを含む、任意の Excalidraw 要素 (四角形、楕円、ダイヤモンド、テキスト、矢印など) を作成、更新、削除、および照会します。

  • 位置 ( x , y )

  • 寸法（ width 、 height ）

  • スタイリング ( backgroundColor 、 strokeColor 、 strokeWidth 、 roughness 、 opacity )

  • テキスト ( text 、 fontSize 、 fontFamily )

  • 線の形状（ points ）

  • ロック中（ lockedフラグ）

• 高度な要素操作
  要素をグループ化、グループ解除、整列、分散、ロック、およびロック解除します。

• シーンとアプリの状態管理

  • シーン レベルの状態を追跡および変更します: theme 、 viewBackgroundColor 、 viewport (スクロールとズーム)、 selectedElements 、 groups 。

  • すべての要素または個々のシーンのプロパティのライブラリを取得します。

• シーンを保存
  現在のシーン (要素 + appState) をディスク上の.excalidrawファイルにエクスポートします。

• リソース管理
  シーン情報、要素ライブラリ、テーマ、生の要素データにアクセスして変更します。

• 簡単な統合
  Claude Desktop、Cursor、および MCP をサポートするその他の LLM プラットフォームと互換性があります。

• Docker サポート
  依存性ゼロのインストールを実現するシンプルなコンテナ化されたデプロイメント。

APIツールリファレンス

要素の作成と変更

create_element

新しい Excalidraw 要素を作成します。

• 入力

  { "type": "<element type>", "x": <number>, "y": <number>, "width": <number, optional>, "height": <number, optional>, "points": [{"x":<number>,"y":<number>}…], "backgroundColor": "<hex>", "strokeColor": "<hex>", "strokeWidth": <number>, "roughness": <number>, "opacity": <0–1>, "text": "<string>", "fontSize": <number>, "fontFamily": "<string>", "locked": <boolean> }

• 出力

  { "id": "<generated‑id>", "type": "<element type>", "created": true }

update_element

既存の要素のプロパティを更新します。

• 入力

  { "id": "<element id>", }

• 出力

  { "id": "<element id>", "updated": true, "version": <new‑version‑number> }

delete_element

シーンから要素を削除します。

• 入力

  { "id": "<element id>" }

• 出力

  { "id": "<element id>", "deleted": true }

query_elements

オプションのフィルターに一致する要素を一覧表示します。

• 入力

  { "type": "<element type>", "filter": { "<prop>": <value> } }

• 出力

  [ { /* element objects */ } … ]

リソース管理

get_resource

シーンまたはライブラリの情報を取得します。

• 入力

  { "resource": "scene"|"library"|"theme"|"elements" }

• 出力

  • シーン→ { theme, viewport: {x,y,zoom}, selectedElements: […] }

  • ライブラリ/要素→ { elements: [ … ] }

  • テーマ→ { theme: "light"|"dark" }

要素の構成

group_elements / ungroup_elements

要素コレクションをグループ化またはグループ解除します。

• 入力

  { "elementIds": ["id1","id2",…] } { "groupId": "<group id>" }

• 出力

  { "groupId": "<new‑id>", "elementIds": […], "ungrouped": true? }

align_elements

複数の要素を指定された端または中央に揃えます。

• 入力

  { "elementIds": […], "alignment": "left"|"center"|"right"|"top"|"middle"|"bottom" }

• 出力
  { aligned: true, elementIds: […], alignment: "<alignment>" }

distribute_elements

要素を水平または垂直に均等に配置します。

• 入力

  { "elementIds": […], "direction": "horizontal"|"vertical" }

• 出力
  { distributed: true, elementIds: […], direction: "<direction>" }

lock_elements / unlock_elements

要素の編集を禁止または許可します。

• 入力

  { "elementIds": [… ] }

• 出力
  { locked: true|false, elementIds: […] }

シーン管理

save_scene

現在のシーン (要素 + appState) を.excalidrawファイルにエクスポートします。

• 入力

  { "filename": "<optional, must end with .excalidraw>" }

• 出力
  Scene saved successfully to <filename>か、エラー メッセージが表示されました。

統合例

クロードデスクトップ

カーソル

.cursor/mcp.jsonを作成します:

ドッカー

またはMCP構成の場合:

インストールガイド

ドッカー

設定オプション

.envまたはコンテナ内の環境変数を介して設定します。

• LOG_LEVEL — ログレベル（デフォルト: "info" ）

• DEBUG — デバッグモード（ "true" / "false" 、デフォルト: "false" ）

• DEFAULT_THEME — デフォルトの UI テーマ ( "light" / "dark" 、デフォルト: "light" )

使用例

長方形を作成してロックする

シーンをファイルに保存