The canvas editor

Work in the canvas editor: the tool rail panels, the canvas and its artboard ratios, the Inspector, undo/redo, and the full keyboard-shortcut set.

Editor layout

The editor has three regions: the icon tool rail on the left, the canvas in the center, and the Inspector on the right. A rail panel slides over the canvas when you open a tool, and the Layers panel is open by default.

The editor with the tool rail, canvas, and Inspector

The tool rail

The rail's tools, from top to bottom, with Help at the foot:

  • Add element: insert an element onto the canvas
  • Layers: reorder, show or hide, and lock the elements in your design
  • Brand: the design levers for your palette, fonts, and canvas background
  • Connect data: bind template fields to your product data
  • Assets: the images you have uploaded
  • Templates: switch templates or import a design (including Import from Figma)
  • Help: open the keyboard-shortcut cheat sheet

Working on the canvas

Select an element to move, resize, or rotate it. The design adapts across the artboard ratios (1:1, 9:16, and 4:5), and a safe-zone overlay shows where content stays clear of the frame. Double-click an image to crop it in place. The exact-preview toggle swaps the live board for the byte-true rendered PNG so you can confirm exactly what ships.

The Inspector

The Inspector on the right shows the selected element's numeric position and size plus its color, opacity, and corner radius, and the canvas background controls. During a drag it tracks the live position, so the readout stays in step with the canvas.

Undo, redo, and history

Every canvas change is one undoable step. Undo and redo work from the keyboard on the canvas and from the top-bar buttons, and both drive the same history stack.

Keyboard shortcuts

The editor shares these shortcuts, grouped by what you reach for. The Help button in the tool rail opens the same cheat sheet inside the editor.

Selection & clipboard

⌘ASelect all elements
⌘CCopy
⌘VPaste
⌘DDuplicate
EscDeselect
Delete BackspaceDelete the selected element(s)

History

⌘ZUndo
⇧⌘Z ⌘YRedo

Move & arrange

← ↑ → ↓Nudge the selection 1px
⇧ + arrowNudge the selection 10px
Tab ⇧TabCycle through layers

Canvas

Space + dragPan around the canvas
⌘ + scrollZoom in and out around the cursor
Double-clickCrop an image in place

Multi-select

⇧-clickAdd or remove an element from the selection
Drag a boxMarquee-select several, then align them in the Inspector

Rotate

Drag handleRotate in fine 1° steps
⇧ + dragRotate in coarse 15° steps