mcpField
E
excalidraw-mcp

excalidraw-mcp

ローカル
github.com/cmd8メディア・デザイン548 週間前に更新
リポジトリ

excalidraw-mcp について

excalidraw-mcpは、Excalidrawの図ファイルを編集するMCPサーバーです。MCPクライアントからノードの作成や接続、要素の削除、図全体の状態確認ができます。

主な機能

  1. 01ラベル付きノードの作成
  2. 02矢印によるノード接続
  3. 03ノードやエッジの削除
  4. 04図全体の状態確認

活用シーン

  1. 01ラベル付きノードで図を作成
  2. 02図の要素間に関係を追加
  3. 03図の構造とラベルを確認

MCP 対応

Excalidrawの図要素を作成、接続、削除、確認するツールをMCPクライアントに提供します。必須の --diagram オプションで図ファイルを指定します。

設定

ローカルサーバーの設定はどのクライアントでも共通です。コピーしてクライアントの MCP 設定ファイルに貼り付けてください。

mcp.json · 共通設定
{
  "mcpServers": {
    "cmd8-excalidraw": {
      "command": "npx",
      "args": [
        "-y",
        "@cmd8/excalidraw-mcp"
      ]
    }
  }
}
起動コマンドnpx -y @cmd8/excalidraw-mcp

ローカルサーバーにはマシン上の実行環境（Node.js 18 以上など）が必要です。設定ファイルの場所はクライアントごとに異なります。

パッケージ
npm@cmd8/excalidraw-mcp1.2.0

ツール

ツール一覧はまだ取得されていません

ローカルサーバーのツールはマシン上で起動して初めて取得できます。メンテナーはまだツール一覧を提供していません。

詳細

@cmd8/excalidraw-mcp

Excalidraw の図表用 Model Context Protocol（MCP）サーバーです。

🛠️ インストール

必要条件
  • Node.js >= v18.0.0
Cursor にインストール

Cursor の MCP 設定に追加します（~/.cursor/mcp.json）：

{
  "mcpServers": {
    "excalidraw": {
      "command": "npx",
      "args": ["-y", "@cmd8/excalidraw-mcp", "--diagram", "/path/to/diagram.excalidraw"]
    }
  }
}
Claude Code にインストール 
claude mcp add excalidraw -- npx -y @cmd8/excalidraw-mcp --diagram /path/to/diagram.excalidraw
Amp にインストール 
amp mcp add excalidraw -- npx -y @cmd8/excalidraw-mcp --diagram /path/to/diagram.excalidraw
VS Code にインストール

VS Code の MCP 設定に追加します：

{
  "mcp": {
    "servers": {
      "excalidraw": {
        "type": "stdio",
        "command": "npx",
        "args": ["-y", "@cmd8/excalidraw-mcp", "--diagram", "/path/to/diagram.excalidraw"]
      }
    }
  }
}
Windsurf にインストール

Windsurf の MCP 設定に追加します：

{
  "mcpServers": {
    "excalidraw": {
      "command": "npx",
      "args": ["-y", "@cmd8/excalidraw-mcp", "--diagram", "/path/to/diagram.excalidraw"]
    }
  }
}
Claude Desktop にインストール

claude_desktop_config.json に追加します：

{
  "mcpServers": {
    "excalidraw": {
      "command": "npx",
      "args": ["-y", "@cmd8/excalidraw-mcp", "--diagram", "/path/to/diagram.excalidraw"]
    }
  }
}
OpenAI Codex にインストール

Codex の MCP 設定に追加します：

[mcp_servers.excalidraw]
command = "npx"
args = ["-y", "@cmd8/excalidraw-mcp", "--diagram", "/path/to/diagram.excalidraw"]

CLI オプション

  • -d, --diagram（必須）：Excalidraw の図表ファイルへのパス

🔨 利用可能なツール

createNode

図表に新しいノード（ラベル付きの図形）を作成します。作成したノードの ID を返します。

createEdge

2 つのノードをつなぐ矢印を作成します。ノードは ID またはラベルのテキストで指定できます。

deleteElement

ID またはラベルを指定して、図表からノードまたはエッジを削除します。

getFullDiagramState

ノード、関係、ラベル、フレーム、色など、図表全体を Markdown 形式で返します。

ライセンス

MIT

コメント

Markdown 対応

MCP は初めてですか？

プロトコルの概要から最初のサーバーの導入まで、よくある疑問にまとめて答えます。

AI アプリケーションが外部のツールやデータソースに統一的な方法で接続するためのオープンなプロトコルです。クライアントはモデルとの対話を担い、MCP サーバーはツール・リソース・プロンプトテンプレートを提供します。標準メッセージでやり取りするため、1 つのサーバーを複数のクライアントで再利用できます。