Skip to main content
The canvas editor lives at /canvas/:id. Four regions you use every day.

​
Layout

Launch deck·share·publish·settings
Chat
Export
Promote
Assets
Settings
VHFTCundo · redo · history

​
Chat panel (left)

Your conversation with the canvas agent. See The chat and the agent for the full loop.
  • Composer. Type, attach images, pick design systems and styles.
  • History. Every turn the agent has taken on this canvas.
  • New chat. Start a fresh thread without losing the old one. Same canvas.
  • Stop. Cancel a streaming turn. Frames already landed stay.

​
Infinite canvas (center)

A Pixi.js viewport rendering your frames. Each frame is an iframe on top of a Pixi node.
  • Pan. Spacebar + drag, middle mouse, or two-finger scroll.
  • Zoom. Cmd / Ctrl + scroll, or pinch.
  • Select. Click a frame, shift-click for multi-select, drag-rectangle for marquee.
  • Edit in place. Double-click a frame to enter its iframe.
  • Right-click. Reference in chat, duplicate, delete, export, copy.
Tabs for the things you do to a frame, not with it.

​
Bottom toolbar

The interaction modes. The toolbar also exposes undo / redo and the chat-history switcher.

​
Working patterns

The default loop. Brief in chat, watch frames render, use the comment tool for surgical fixes, export when done. Most canvases finish in this loop.
Ask the agent to clone a frame from your existing site. Edit the copy and colors. Add to app to deploy it as a real React page.
Generate a hero. Duplicate it three times. Use chat to push each in a different direction (“first one, more editorial. Second, more brutalist. Third, our brand exactly.”). Pick the winner.
Pan so two frames are visible. Use the comment tool on each. Send a single message with both pointers: “These should match the design system. Pick the tighter of the two as canonical.”

​
Settings worth knowing

  • Project settings → Connected apps. If you’ve promoted frames to a UI project, every promote shows here with sync state (in sync, stale, never synced).
  • Settings → MCP. Your MCP URL and API key. Same key works for canvas and UI MCP tools. See MCP overview.
  • Settings → Credits. Account-level. Open it from the org dropdown, not the canvas. See Credits.

​
Next

Keyboard shortcuts

The full cheat sheet.

Exports overview

Every format the canvas ships.