Inspect and edit Three.js scenes, materials, shaders, lights in real time from any AI agent
Connect Runs on your machine
claude mcp add threejs-devtools -e DEV_PORT=<DEV_PORT> -e BRIDGE_PORT=<BRIDGE_PORT> -e BROWSER=<BROWSER> -e HEADLESS=<HEADLESS> -e CHROME_PATH=<CHROME_PATH> -- npx -y [email protected]
{
"mcpServers": {
"threejs-devtools": {
"command": "npx",
"args": [
"-y",
"[email protected]"
],
"env": {
"DEV_PORT": "<DEV_PORT>",
"BRIDGE_PORT": "<BRIDGE_PORT>",
"BROWSER": "<BROWSER>",
"HEADLESS": "<HEADLESS>",
"CHROME_PATH": "<CHROME_PATH>"
}
}
}
}
{
"mcpServers": {
"threejs-devtools": {
"command": "npx",
"args": [
"-y",
"[email protected]"
],
"env": {
"DEV_PORT": "<DEV_PORT>",
"BRIDGE_PORT": "<BRIDGE_PORT>",
"BROWSER": "<BROWSER>",
"HEADLESS": "<HEADLESS>",
"CHROME_PATH": "<CHROME_PATH>"
}
}
}
}
{
"servers": {
"threejs-devtools": {
"type": "stdio",
"command": "npx",
"args": [
"-y",
"[email protected]"
],
"env": {
"DEV_PORT": "<DEV_PORT>",
"BRIDGE_PORT": "<BRIDGE_PORT>",
"BROWSER": "<BROWSER>",
"HEADLESS": "<HEADLESS>",
"CHROME_PATH": "<CHROME_PATH>"
}
}
}
}
Replace the values in angle brackets with your own. Keys stay on your machine; we never see them.
Tools
This server runs locally, so its tools are listed by your MCP client once it starts.
Environment variables
| Name | Description |
|---|---|
DEV_PORTOptional | Dev server port to proxy (auto-detected from package.json if not set) |
BRIDGE_PORTOptional | Bridge proxy port (default: 9222) |
BROWSEROptional | Set to 'none' to disable auto-opening browser |
HEADLESSOptional | Set to 'true' for headless browser mode (CI) |
CHROME_PATHOptional | Custom Chrome/Edge executable path |
Details
| Package | [email protected] (NPM, stdio) |
| First published | 16 Mar 2026 |
| Last updated | 16 Mar 2026 |
| Registry name | io.github.DmitriyGolub/threejs-devtools |
More ai and media servers See all
Listing data from the official MCP registry. Status and tools from NestDaddy's daily check. Browse all MCP servers.
