Docs / Canvas

Devices and layouts

Presets, custom sizes, scenario sets, and the Free two-tile ceiling.

Each tile is a viewport: width, height, and device pixel ratio. Presets match common phones and desktops; custom sizes cover one-off designs.

Add a device

  1. Click Device in the bottom action bar.
  2. Pick a preset from the library, or open custom size.
  3. The new frame appears on the canvas at the shared URL. Press 2 to Arrange if you want a tidy grid.

Custom size

Enter width and height in CSS pixels. Tessera still applies the right DPR for captures on Pro. Use this for design mocks or unusual breakpoints your CSS actually uses.

Scenario sets

Device sets group a handful of related sizes (e.g. a mobile-first trio) so you can refill the canvas without picking one-by-one. On Free you still stop at two tiles total, so pick the two sizes that matter most for the check.

Free limit

Two tiles
Free sessions cap at two canvas tiles. Trying to add a third prompts upgrade. Sync, Follow, and Arrange all work at that size.
Pro
Unlimited tiles on the canvas. Live sessions still have a concurrent engine cap (see iframe vs Live). Full comparison: Free vs Pro.

Related