Playcanvas Editor MCP Server

What is Playcanvas Editor MCP Server about?

Automates the PlayCanvas Editor using LLM commands. The server exposes a set of tools (entity, asset, scene, store) that an LLM can invoke to perform editor tasks without manual UI interaction.

How to use Playcanvas Editor MCP Server?

1. Clone the repository and run npm install.
2. Install the Chrome extension located in the extensions folder and load it in Chrome (Developer mode → Load unpacked).
3. Start the server with npx:

   npx tsx /path/to/mcp-editor/src/server.ts
   

   (replace the path with the actual location on your machine). The server listens on the port defined in the env (PORT=52000).
4. Configure your LLM client (Claude Desktop or Cursor) to point to the MCP server using an mcp.json (or claude_desktop_config.json) that references the server name playcanvas.
5. Open the PlayCanvas Editor, click the extension icon, and press CONNECT (port must match the one set in the config).
6. Issue commands through Claude Desktop or Cursor; the LLM will call the exposed tools via the MCP protocol.

Key Features

• Entity Management: list, create, delete, duplicate, modify, reparent, add/remove components, script handling.
• Asset Operations: list, create, delete, instantiate templates, edit script text, parse scripts, set material properties.
• Scene Settings: query and modify scene configuration.
• Store Interaction: search, retrieve, and download assets from the PlayCanvas Store.
• Supports both Claude Desktop (recommended) and Cursor clients.
• Simple JSON‑based configuration for cross‑platform setup (Windows/macOS).

Use Cases

• Rapid prototyping of game scenes by describing desired changes in natural language.
• Bulk asset creation or cleanup automated through scripted prompts.
• Continuous integration pipelines that adjust editor state before publishing.
• Training assistants for new developers to manipulate the editor without learning the UI.
• Generating and testing variations of entity hierarchies or material settings automatically.

FAQ

Q: Which LLM works best with the server? A: Claude Desktop on a Pro plan provides sufficient context length; the free tier may be unreliable.

Q: Can multiple editor instances connect simultaneously? A: No. Only one PlayCanvas Editor instance can be connected to the MCP server at a time.

Q: Do I need a special Chrome extension? A: Yes, load the extension from the extensions folder to enable the CONNECT button and communication bridge.

Q: How do I change the listening port? A: Modify the PORT value in the env section of your MCP config JSON.

Q: Is the server compatible with other LLM providers? A: The current implementation is optimized for Claude, but the protocol can be adapted to any LLM that can call HTTP tools.

██████╗ ██╗      █████╗ ██╗   ██╗ ██████╗ █████╗ ███╗   ██╗██╗   ██╗ █████╗ ███████╗
██╔══██╗██║     ██╔══██╗╚██╗ ██╔╝██╔════╝██╔══██╗████╗  ██║██║   ██║██╔══██╗██╔════╝
██████╔╝██║     ███████║ ╚████╔╝ ██║     ███████║██╔██╗ ██║██║   ██║███████║███████╗
██╔═══╝ ██║     ██╔══██║  ╚██╔╝  ██║     ██╔══██║██║╚██╗██║╚██╗ ██╔╝██╔══██║╚════██║
██║     ███████╗██║  ██║   ██║   ╚██████╗██║  ██║██║ ╚████║ ╚████╔╝ ██║  ██║███████║
╚═╝     ╚══════╝╚═╝  ╚═╝   ╚═╝    ╚═════╝╚═╝  ╚═╝╚═╝  ╚═══╝  ╚═══╝  ╚═╝  ╚═╝╚══════╝

███╗   ███╗ ██████╗██████╗        ███████╗███████╗██████╗ ██╗   ██╗███████╗██████╗ 
████╗ ████║██╔════╝██╔══██╗       ██╔════╝██╔════╝██╔══██╗██║   ██║██╔════╝██╔══██╗
██╔████╔██║██║     ██████╔╝       ███████╗█████╗  ██████╔╝██║   ██║█████╗  ██████╔╝
██║╚██╔╝██║██║     ██╔═══╝        ╚════██║██╔══╝  ██╔══██╗╚██╗ ██╔╝██╔══╝  ██╔══██╗
██║ ╚═╝ ██║╚██████╗██║            ███████║███████╗██║  ██║ ╚████╔╝ ███████╗██║  ██║
╚═╝     ╚═╝ ╚═════╝╚═╝            ╚══════╝╚══════╝╚═╝  ╚═╝  ╚═══╝  ╚══════╝╚═╝  ╚═╝

An MCP Server for automating the PlayCanvas Editor using an LLM.

[!IMPORTANT]
At the moment, the MCP Server needs to be driven by Anthropic's Claude. Our experience shows that the free tier for Claude does not deliver a big enough chat context to operate the MCP Server reliably. Therefore, we strongly recommend subscribing to a Pro Claude account.

Available Tools

• Entity
  • list_entities
  • create_entities
  • delete_entities
  • duplicate_entities
  • modify_entities
  • reparent_entity
  • add_components
  • remove_components
  • add_script_component_script
• Asset
  • list_assets
  • create_assets
  • delete_assets
  • instantiate_template_assets
  • set_script_text
  • script_parse
  • set_material_diffuse
• Scene
  • query_scene_settings
  • modify_scene_settings
• Store
  • store_search
  • store_get
  • store_download

Installation

Run npm install to install all dependencies.

Install Chrome Extension

1. Visit chrome://extensions/ and enable Developer mode
2. Click Load unpacked and select the extensions folder
3. Load the PlayCanvas Editor. The extension should be loaded.

Run MCP Server

The MCP Server can be driven by Cursor or Claude Desktop.

[!TIP]
We have found Claude Desktop to be generally more reliable.

Claude Desktop

1. Install Claude Desktop.
2. Go to Claude > Settings.
3. Select Developer and then Edit Config.
4. This will open claude_desktop_config.json, your MCP Config JSON file.

Cursor

1. Install Cursor.
2. Select File > Preferences > Cursor Settings.
3. Click + Add new global MCP server.
4. This will open mcp.json, your MCP Config JSON file.

[!TIP]
Also in Cursor Settings, select Features and scroll to the Chat section. Activate Enable auto-run mode to allow the LLM to run MCP tools without requiring constant authorization. You do this at your own risk (but we prefer it)!

[!IMPORTANT]
In Cursor, ensure you have Agent selected. Ask and Edit modes will not recognize the MCP Server.

MCP Config JSON File

This is how your config should look:

Windows

{
  "mcpServers": {
    "playcanvas": {
      "command": "cmd",
      "args": [
        "/c",
        "npx",
        "tsx",
        "C:\\path\\to\\mcp-editor\\src\\server.ts"
      ],
      "env": {
        "PORT": "52000"
      }
    }
  }
}

macOS

{
  "mcpServers": {
    "playcanvas": {
      "command": "npx",
      "args": [
        "tsx",
        "/path/to/mcp-editor/src/server.ts"
      ],
      "env": {
        "PORT": "52000"
      }
    }
  }
}

Connecting the Editor to the MCP Server

The PlayCanvas Editor does not connect to the MCP Server automatically. To connect:

1. Activate a Chrome tab running the PlayCanvas Editor.
2. Select the Extensions icon to the right of the address bar.
3. Select PlayCanvas Editor MCP Extension to open the extension popup.
4. Select CONNECT (the port number should match what is set in your MCP Config JSON File).

[!NOTE] You can currently only connect one instance of the PlayCanvas Editor to the MCP Server at any one time.

You should now be able to issue commands in Claude Desktop or Cursor.