Canvas Basics

Panning, zooming, and finding your way around the surface where you build everything.

The canvas is the surface where you build diagrams. It fills most of the editor, with the palette and a few panels on top for adding elements and navigating your library. This article covers moving around it so the rest of livediagram feels natural.

Moving around

You will pan and zoom constantly. There are a few ways to do each:

  • Pan by holding the Space bar and dragging, by middle-click dragging from any tool, or by switching to the Hand tool (shortcut H) and dragging on empty canvas. On a trackpad, a two-finger drag pans too.
  • Zoom with the zoom buttons in the bottom-right of the canvas, Ctrl/Cmd + scroll, Ctrl/Cmd + + and -, or pinch-zoom on a trackpad or touch screen. Shift+1 zooms to fit everything on the tab. The pattern background tiles endlessly as you move, so you never run out of canvas.

On a phone-sized screen the Hand tool is the default, so a drag moves the view; on a larger screen the default is the Select tool (Plan mode starts on Hand). See Pan and Zoom and Zoom Controls.

AB−100%+
Pan with a grabbing hand and zoom from the controls in the bottom-right of the canvas.

Select versus Hand

The selection-mode dropdown at the top of the Palette holds the canvas tools (see Selection Modes). The two you will use most:

  • Select (shortcut V) is for working with elements: click to select (click again to deselect), shift-click to add to the selection, and drag on empty canvas to draw a marquee that selects everything inside it.
  • Hand (shortcut H) is for moving the view: drag on empty canvas to scroll around without touching any elements.

Middle-click panning works from any tool, so you rarely need to leave Select just to move the view a little.

Around the canvas

A few things sit over the canvas (see Panel Layout):

  • Palette, the strip across the top, adds shapes, arrows, icons, and tools. See the Palette guides.
  • Explorer, behind the menu button in the top-left corner, is your library of documents and folders. See Explorer.
  • Mode switch, beside the menu button, moves the tab between Diagram, Draw, Facilitate, Illustrate and Plan. On a phone, pick the mode from the Mode section at the foot of the tab menu instead. See Editor Modes.
  • Corner panels, such as the Map and the AI Assistant, can be dragged by their header to another corner and collapsed to a banner.

Around them sit the fixed controls: the tab bar along the bottom, with Search, Settings and the light/dark switch at its right-hand end, and a cluster in the bottom-right corner with Undo and Redo, the session tools (timer, vote and poll in Facilitate; timer and vote in Plan), Layers (not in Plan or Illustrate) beside the Theme & canvas button, and the zoom controls. Right-click menus carry per-element formatting, and the tab menu carries tab-wide tools.

On a phone the layout is the same: the menu button sits in its own card left of the strip, the strip's tiles swipe sideways, and tapping a panel's header collapses it, so the canvas stays readable.

Light and dark

The editor has its own appearance switch at the right-hand end of the bottom bar: click it to step through Light, Dark and System (which follows your device). This recolours the editor's interface around your canvas, and the canvas too: every theme has a light and a dark side, and you see the one that matches your appearance. The theme itself, which recolours the canvas content, is set from the Theme & canvas button. See Dark Mode.

Lost on a big canvas? Zoom out with the bottom-right controls to get your bearings, then zoom back in on the part you need. For total focus, try Zen mode to hide all the toolbars and panels.

Was this article helpful?