trayce

Use when the user wants to draw, sketch, or send visual content to this conversation via the trayce canvas. Also use when asked to push, send, or place images on a canvas. Triggers on mentions of drawing, sketching, canvas, visual, trayce, or pushing images.

Trayce — Canvas Drawing Tool

Browser canvas connected to this Claude Code session via MCP Channels. Users draw sketches and submit them with optional prompt text. You can push images back to their canvas.

Receiving Sketches

Submissions arrive as channel notifications. Read the PNG with the Read tool — it's a file path, not inline data. The path comes from the notification (it will be under the OS temp dir on whichever platform the server is running).

<channel source="trayce" image_path="{path from notification}">
  User's prompt text
</channel>

Pushing Images to the Canvas

Use mcp__trayce__push_image. Always prefer file_path — it avoids context window limits.

push_image(file_path: "<absolute path to image>", label: "Architecture")
ParamUsage
file_pathAbsolute path to PNG/JPEG on disk. Always use this.
image_base64Only for tiny inline data (<50KB). Avoid.
labelLayer name in the canvas UI. Optional.

Images arrive as hidden, movable/resizable transform layers.

Workflow: Save image to disk first (e.g., download with curl, generate with a tool), then push via file_path.

Server

Use the cross-platform TypeScript scripts — they work on Linux, macOS, and Windows.

ActionCommand
Startbun run ${CLAUDE_PLUGIN_ROOT}/../scripts/start.ts
Stopbun run ${CLAUDE_PLUGIN_ROOT}/../scripts/stop.ts

start.ts prints the server status as JSON ({"status":"existing"|"new","url":"...","pid":...}); if a server is already running, it reports the existing one without relaunching.