Skip to main content
A canvas artifact brings related screens together on a zoomable visual board. Use it to compare layouts, review a flow, and give feedback on the exact part of a screen that needs to change. This is an artifact inside a Task, not the Task tab’s arrangement of open panels.

Create a Canvas

Choose Add artifact → New canvas in the Artifacts panel, or ask an agent:
Create a canvas of the checkout flow, with cart, payment, success, and payment failure screens. Match the existing app.
Open it from Artifacts. Type @ and choose the canvas under Artifacts to refer to it in a message.

Move Around and Try a Flow

  • Pan with Hand (H), or hold Space while dragging.
  • Use the zoom percentage menu to zoom in or out, choose a preset, or Fit to screen.
  • Use the page picker when the canvas has more than one page of boards.
  • Play a board to interact with its buttons and links. A link to another board can take you through the flow. Stop play or press Esc to return to editing.
  • Open a board fullscreen for a closer look.
Play applies to one board at a time. Other boards and notes stay available for editing.

Edit the Boards

In the desktop app, use Select (V) to select and reposition boards and notes. Resize boards to try different screen sizes. Edits are saved with the Task. Select an element inside a board to open its editing panel:
  • Design: browse Layers, and adjust size, spacing, typography, colours, borders, and visibility.
  • Code: change the selected element’s inline CSS.
  • Tweaks: adjust controls the board’s author has exposed, such as an accent colour or spacing value.
You can edit supported text directly on the board. If an element is generated by the page’s scripts rather than written in its source, ask the agent to change it instead. Use Note (N) or Text (T) to add notes and labels beside the screens. Pen (P) and More shapes add freehand marks, rectangles, ovals, lines, and arrows. Paste or drop images onto the canvas to add visual references. Use Undo and Redo in the zoom menu to undo your canvas changes.

Comment and Send to Chat

Turn on Comments to leave feedback on an element, selected text, a board, or a point on the canvas. Numbered pins mark threads; select one to reopen the discussion. See Comments. Select an element and use Send to chat to add a reference and visual context to an existing agent chat’s draft. For example, ask the agent to simplify a crowded form or add the missing error state. Nothing is sent until you send the message.

Files Behind a Canvas

A canvas is a folder with canvas.json, board HTML files, and supporting assets. Agents can update those files while you review the boards in Traycer. Your layout, notes, and other canvas changes are saved alongside them.