Editor Mcp Server
An MCP Server that enables LLMs to build real-time 3D web applications in the PlayCanvas Editor.
playcanvas
README
██████╗ ██╗ █████╗ ██╗ ██╗ ██████╗ █████╗ ███╗ ██╗██╗ ██╗ █████╗ ███████╗
██╔══██╗██║ ██╔══██╗╚██╗ ██╔╝██╔════╝██╔══██╗████╗ ██║██║ ██║██╔══██╗██╔════╝
██████╔╝██║ ███████║ ╚████╔╝ ██║ ███████║██╔██╗ ██║██║ ██║███████║███████╗
██╔═══╝ ██║ ██╔══██║ ╚██╔╝ ██║ ██╔══██║██║╚██╗██║╚██╗ ██╔╝██╔══██║╚════██║
██║ ███████╗██║ ██║ ██║ ╚██████╗██║ ██║██║ ╚████║ ╚████╔╝ ██║ ██║███████║
╚═╝ ╚══════╝╚═╝ ╚═╝ ╚═╝ ╚═════╝╚═╝ ╚═╝╚═╝ ╚═══╝ ╚═══╝ ╚═╝ ╚═╝╚══════╝
███╗ ███╗ ██████╗██████╗ ███████╗███████╗██████╗ ██╗ ██╗███████╗██████╗
████╗ ████║██╔════╝██╔══██╗ ██╔════╝██╔════╝██╔══██╗██║ ██║██╔════╝██╔══██╗
██╔████╔██║██║ ██████╔╝ ███████╗█████╗ ██████╔╝██║ ██║█████╗ ██████╔╝
██║╚██╔╝██║██║ ██╔═══╝ ╚════██║██╔══╝ ██╔══██╗╚██╗ ██╔╝██╔══╝ ██╔══██╗
██║ ╚═╝ ██║╚██████╗██║ ███████║███████╗██║ ██║ ╚████╔╝ ███████╗██║ ██║
╚═╝ ╚═╝ ╚═════╝╚═╝ ╚══════╝╚══════╝╚═╝ ╚═╝ ╚═══╝ ╚══════╝╚═╝ ╚═╝
An MCP Server for automating the PlayCanvas Editor using an LLM.
<img width="1864" alt="Screenshot 2025-03-21 at 15 50 10" src="https://github.com/user-attachments/assets/393ffe73-40eb-4e1b-9442-2295bbb63326" />
[!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_entitiescreate_entitiesdelete_entitiesduplicate_entitiesmodify_entitiesreparent_entityadd_componentsremove_componentsadd_script_component_script
- Asset
list_assetscreate_assetsdelete_assetsinstantiate_template_assetsset_script_textscript_parseset_material_diffuse
- Scene
query_scene_settingsmodify_scene_settings
- Store
store_searchstore_getstore_download
Installation
Run npm install to install all dependencies.
Install Chrome Extension
- Visit
chrome://extensions/and enable Developer mode - Click
Load unpackedand select theextensionsfolder - 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
- Install Claude Desktop.
- Go to
Claude>Settings. - Select
Developerand thenEdit Config. - This will open
claude_desktop_config.json, your MCP Config JSON file.
Cursor
- Install Cursor.
- Select
File>Preferences>Cursor Settings. - Click
+ Add new global MCP server. - This will open
mcp.json, your MCP Config JSON file.
[!TIP]
Also inCursor Settings, selectFeaturesand scroll to theChatsection. ActivateEnable auto-run modeto 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 haveAgentselected.AskandEditmodes 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:
- Activate a Chrome tab running the PlayCanvas Editor.
- Select the Extensions icon to the right of the address bar.
- Select PlayCanvas Editor MCP Extension to open the extension popup.
- 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.
Recommended Servers
playwright-mcp
A Model Context Protocol server that enables LLMs to interact with web pages through structured accessibility snapshots without requiring vision models or screenshots.
Magic Component Platform (MCP)
An AI-powered tool that generates modern UI components from natural language descriptions, integrating with popular IDEs to streamline UI development workflow.
MCP Package Docs Server
Facilitates LLMs to efficiently access and fetch structured documentation for packages in Go, Python, and NPM, enhancing software development with multi-language support and performance optimization.
Claude Code MCP
An implementation of Claude Code as a Model Context Protocol server that enables using Claude's software engineering capabilities (code generation, editing, reviewing, and file operations) through the standardized MCP interface.
@kazuph/mcp-taskmanager
Model Context Protocol server for Task Management. This allows Claude Desktop (or any MCP client) to manage and execute tasks in a queue-based system.
Linear MCP Server
Enables interaction with Linear's API for managing issues, teams, and projects programmatically through the Model Context Protocol.
mermaid-mcp-server
A Model Context Protocol (MCP) server that converts Mermaid diagrams to PNG images.
Jira-Context-MCP
MCP server to provide Jira Tickets information to AI coding agents like Cursor
Linear MCP Server
A Model Context Protocol server that integrates with Linear's issue tracking system, allowing LLMs to create, update, search, and comment on Linear issues through natural language interactions.
Sequential Thinking MCP Server
This server facilitates structured problem-solving by breaking down complex issues into sequential steps, supporting revisions, and enabling multiple solution paths through full MCP integration.