CanvasKeep

CanvasKeep MCP サーバー

Claude Code や Codex などの AI ツールで Excalidraw の図を生成し、CanvasKeep のワークスペースに直接保存できる MCP（Model Context Protocol）サーバーです。

セットアップ

1. API キーを取得する

1. CanvasKeep にログインします
2. プロフィールメニュー（右上）をクリックして、API Keys を選択します
3. 新しいキーを生成し、すぐにコピーします（再表示できません）

2. インストールして登録する

Claude Code：

claude mcp add canvaskeep \
  -e CANVASKEEP_API_KEY=ck_your_key_here \
  -- npx canvaskeep-mcp

Codex／その他の MCP クライアント：

{
  "mcpServers": {
    "canvaskeep": {
      "command": "npx",
      "args": ["canvaskeep-mcp"],
      "env": {
        "CANVASKEEP_API_KEY": "ck_your_key_here"
      }
    }
  }
}

3. 環境変数

変数	必須	デフォルト	説明
CANVASKEEP_API_KEY	はい	-	CanvasKeep ダッシュボードの API キー
CANVASKEEP_MASTER_KEY	いいえ	-	暗号化された図の読み取りや編集に必要です。canvaskeep.com/dashboard/encryption からコピーします（MCP サーバー用のキー）
CANVASKEEP_API_URL	いいえ	https://canvaskeep.com	API のベース URL（ローカル開発用の上書き）

利用可能なツール

ツール	説明
list_workspaces	すべてのワークスペースを一覧表示します
create_workspace	新しいワークスペースを作成します
list_folders	ワークスペース内のフォルダーを一覧表示します
create_folder	必要に応じてフォルダーを入れ子にして作成します
list_diagrams	ワークスペース内の図を一覧表示します
create_diagram	必要に応じてフォルダー内に図を作成します
update_diagram	図の名前を変更します
delete_diagram	図を完全に削除します
get_diagram_summary	図のメタデータと要素数を取得します
get_diagram_scene	図の Excalidraw シーン全体を読み取ります
save_diagram_scene	Excalidraw シーン全体を図に書き戻します
generate_diagram	ノードとエッジから自動レイアウトで図を生成します

暗号化

CanvasKeep で暗号化した図は、AI ツールが操作する際も暗号化されたままです。get_diagram_scene または save_diagram_scene が暗号化された図にアクセスすると、このサーバーは CANVASKEEP_MASTER_KEY を使ってローカルで復号・再暗号化します（AES-GCM。詳細は src/encryption.ts を参照してください）。マスターキーがマシンの外に出ることはありません。

generate_diagram は、指定したノードとエッジを CanvasKeep に送信し、サーバー上でレイアウトします。そのため、この方法で生成した図は暗号化されずに保存されます。

使用例

Claude Code に次のように依頼します。

「React フロントエンド、Node API、PostgreSQL データベース、Redis キャッシュを含むウェブアプリのアーキテクチャ図を描いてください」

Claude は MCP ツールを使って、適切に配置されたボックスとラベル付きの矢印を含む図を CanvasKeep のワークスペースに作成します。

開発

git clone https://github.com/CanvasKeep/canvaskeep-mcp.git
cd canvaskeep-mcp
npm install
npm run build
CANVASKEEP_API_KEY=ck_... CANVASKEEP_API_URL=http://localhost:3000 node dist/index.js

Claude Code からローカルビルドを実行するには：

claude mcp add canvaskeep \
  -e CANVASKEEP_API_KEY=ck_your_key_here \
  -- node /path/to/canvaskeep-mcp/dist/index.js

ライセンス

MIT