
yctimlin/mcp_excalidraw
Developer toolsこのページは AI により自動翻訳されています。技術的な詳細は原文をご確認ください。 原文を見る
MCPサーバーとExcalidraw用のClaude Codeスキル — AIエージェントによる図の作成、編集、エクスポートをリアルタイムキャンバス同期で行うプログラム型キャンバスツールキット。
概要
ライブのExcalidrawキャンバスを実行し、AIエージェントから制御します。このリポジトリは以下の内容を提供します: - : モデルコンテキストプロトコル(Claude Desktop、カーソル、Codex CLIなど)を経由接続- : Claude Code、Codex CLI、その他のスキル対応エージェント用のポータブルスキル キーワード:Excalidrawエージェントスキル、Excalidraw MCPサーバー、AI図作成、Claudeコードスキル、Codex CLIスキル、ClaudeデスクトップMCP、カーソルMCP、MermaidからExcalidrawへ。 AIエージェントは単一のプロンプトから完全なアーキテクチャ図を作成します(4倍速)。YouTubeで全文動画を視聴 このリポジトリには2つの別々のプロセスが含まれています: - Canvasサーバー:Web UI + REST API + WebSocketの更新(デフォルトのhttp://127.0.0.1:3000)]) - MCPサーバー:stdio上でMCPツールを公開;EXPRESS_SERVER_URL経由でキャンバスに同期 Excalidrawには公式MCPが搭載されており、チャット内で素早く図にプロンプト生成できるのに最適です。私たちは別の問題を解決します。 — 公式MCPは図を作成します。
概要(AI 翻訳)
mcp-excalidraw-serverはAIエージェントにライブのExcalidrawキャンバスを提供し、そこで描画し、見て、洗練し、リポジトリに保存できます。エージェントはアーキテクチャ図やフローチャートをプログラム的に作成し、自身の作業をスクリーンショットで確認し、レイアウトの問題を修正し、.excalidrawファイルをコードの隣にコミットできるエクスポートを行います。
キャンバス1枚、3つの運転方法:
- Agent Skill + CLI — コーディングエージェント(Claude Code、Codex CLI、Cursor、OpenCode)に推奨):
npx -y mcp-excalidraw-server。設定ゼロ、キャンバス自動起動、コンポジブルJSONの入出力。 - MCP Server — 任意のModel Context Protocolクライアント(Claude Desktop、Cursor、Codex CLI、Antigravityなど)向けに26のツールをスタンディオ経由で提供。MCP
2026-07-28](server/discover、リクエストごとの_metaエンベロープ、ハンドシェイクなしのツール呼び出し)を操作し、2025年当時のクライアントでinitializeで開く場合と互換性があります。 - REST API — LangChainおよびカスタムフレームワーク向けの単純なHTTP。
コア描画はローカルで動作します(Node ≥ 20、MITライセンス)— APIキーやアカウントは不要です。マーメイド変換はローカルブラウザキャンバス上で動作します。shareはオプションで、暗号化されたシーンを excalidraw.com にアップロードします。キャンバスページは esm.sh CDNからExcalidrawのフォントを読み込みます。
このページは AI により自動翻訳されています。技術的な詳細は原文をご確認ください。
README
以下は原文 README の抜粋です。原文を見る。
Excalidraw MCP Server, CLI & Agent Skill
mcp-excalidraw-server gives AI agents a live Excalidraw canvas they can draw on, look at, refine, and save into your repo. Your agent creates architecture diagrams and flowcharts programmatically, sees its own work via screenshots, fixes layout problems, and exports .excalidraw files you can commit next to your code.
One canvas, three ways to drive it:
- Agent Skill + CLI — recommended for coding agents (Claude Code, Codex CLI, Cursor, OpenCode):
npx -y mcp-excalidraw-server. Zero config, auto-starts the canvas, composable JSON in/out. - MCP Server — 26 tools over stdio for any Model Context Protocol client (Claude Desktop, Cursor, Codex CLI, Antigravity, …). Speaks MCP
2026-07-28(server/discover, per-request_metaenvelope, tool calls without a handshake) and stays compatible with 2025-era clients that open withinitialize. - REST API — plain HTTP for LangChain and custom frameworks.
Core drawing runs locally (Node ≥ 20, MIT licensed) — no API keys or accounts. Mermaid conversion runs in the local browser canvas; share is optional and uploads an encrypted scene to excalidraw.com. The canvas page loads Excalidraw’s fonts from the esm.sh CDN.
Demo
AI agent creates a complete architecture diagram from a single prompt (4x speed). Watch full video on YouTube
Table of Contents
- Demo
- What It Is
- How We Differ from the Official Excalidraw MCP
- What’s New
- Installation
- Agent Skill
- CLI Reference
- Headless Rendering
- Configure MCP Clients
- MCP Tools (26 Total)
- Quick Start (From Source / Docker)
- Testing
- FAQ
- Troubleshooting
- Known Issues / TODO
- Development
- License
What It Is
インストール
npx -y mcp-excalidraw-server設定
{
"mcpServers": {
"excalidraw": {
"command": "npx",
"args": ["-y", "mcp-excalidraw-server"]
}
}
}