MCP Server Setup Guide

Connect your AI coding assistant to Excalimate

Start the MCP server

Run the server with a single command. It starts in HTTP mode with live preview enabled by default.

Terminal

npx @excalimate/mcp-server

The server will listen on http://localhost:3001/mcp. To use a custom port:

npx @excalimate/mcp-server --port 4000

Connect in Excalimate

Click the broadcast icon in the toolbar (top-right) to connect to the running server. Once connected, you'll see a live preview of everything the AI creates in real-time.

You can configure the server URL in File → Preferences.

Configure your AI tool

Add the MCP server to your AI coding assistant. Pick your tool below:

VS Code (GitHub Copilot)

Create .vscode/mcp.json in your project:

.vscode/mcp.json

{
  "servers": {
    "excalimate": {
      "type": "http",
      "url": "http://localhost:3001/mcp"
    }
  }
}

Cursor

Go to Settings → MCP Servers, then add:

Name: excalimate
Type: http
URL:  http://localhost:3001/mcp

Claude Desktop

Claude Desktop uses stdio mode (no live preview). Add to your claude_desktop_config.json:

claude_desktop_config.json

{
  "mcpServers": {
    "excalimate": {
      "command": "npx",
      "args": ["@excalimate/mcp-server", "--stdio"]
    }
  }
}

Claude Code (CLI)

Start the server, then register it:

npx @excalimate/mcp-server &
claude mcp add excalimate http://localhost:3001/mcp

Windsurf

Add to your mcp_config.json:

mcp_config.json

{
  "mcpServers": {
    "excalimate": {
      "serverUrl": "http://localhost:3001/mcp"
    }
  }
}

That's it! Ask your AI to create diagrams and animations.