Grid

Grids help you design with precision no matter what you're designing for — the web, mobile, or icons. They make sure that the elements are in consistent sizes and positions.

Setting and editing the grid

With no selected elements, open the Properties panel and then Grid. This will enable the grid with the following options:

  • Count – the number of columns on the canvas,
  • Width – the width of columns. It is calculated automatically depending on the count, gutter, margin properties and the size of the canvas,
  • Gutter – the distance between the columns,
  • Margins – the distance from the left and the right edges of the canvas to the closest column.

When the grid is on, elements will snap to the visible columns. Turning the grid off disables this snapping feature, but elements will still align to the canvas and each other. You can also use the shortcut Option "G" in the editor to toggle the grid on and off.