Skip to content

The canvas

Frames and grouping

A frame crops what sits inside it and can lay its contents out for you, which is what separates it from a group.

A frame is the only container on the canvas that changes what its contents do. Everything else on a board holds objects together; a frame crops them, arranges them, and gives the set an edge you can hand to somebody.

They look similar and solve different problems.

Group Frame
Moves as one Yes Yes
Crops its contents No Yes, members are clipped to the frame’s rectangle
Can lay contents out No Yes, with Auto Layout on
Has an edge and a size No, it is the bounds of what is in it Yes, you draw it and resize it
Corner radius No Yes

Reach for a group when a handful of things should travel together. Reach for a frame when the set needs to read as one composition.

Pick the frame tool from the bottom toolbar and drag out a rectangle. A size pill follows the drag so you can hit a specific dimension, and the corners take a radius afterwards.

Anything you drop inside becomes a member and is clipped to the frame’s edge. That clip is what makes a frame useful for holding a look: an oversized image can sit inside a 16:9 frame and only the part you want shows.

Turn Auto Layout on from the toolbar that appears when a single frame is selected and the frame takes over placement, arranging its members on a grid. Turn it off and the members go back to free placement exactly where you put them.

Off is the default, because most boards want a frame as a crop rather than as a layout engine. On is the one to use when a frame is a contact sheet and the ordering matters more than the exact position of any one item.

Five uses cover most boards, and the last two are the ones people find late:

  • Holding a look. A frame around a set says “this group is the direction”, and the crop keeps it reading as a composition rather than as loose parts.
  • Sizing to an output. Draw the frame at the aspect you have to deliver and compose inside it, so nothing is a surprise at export.
  • Handing over a section. A frame is a natural unit to point a teammate at, and it travels as one thing when the board grows around it.
  • Collecting a batch. A locked tool fires run after run into a frame’s grid, so twenty results land arranged instead of stacked on top of each other.
  • Crossing to Figma. A frame is the unit the Figma plugin moves, in both directions, keeping its corner radius, stroke and layout guides.