Skip to content

Grids & Rulers

Show Grids and Rulers on top of the Simulator.

Aligning elements based on grids and rulers allows you to create a balanced design.

  1. Open the Simulator
  2. Select the comparing tab
  3. Click on the Grid button:

CleanShot 2025-01-21 at 13.56.29@2x.png

  1. Open the Simulator
  2. Select the comparing tab
  3. Click on the Rulers button
  4. Hover over the horizontal or vertical ruler and left-mouse click to store a ruler:

CleanShot 2025-01-21 at 13.57.51@2x.png

By tapping ⇧ Shift while your rulers are visible, you’ll be able to see the distance between Rulers and the edges:

CleanShot 2025-01-21 at 13.59.11@2x.png

You can delete a ruler by dragging it outside of the Simulator’s view or by right-clicking the ruler bar:

CleanShot 2025-01-21 at 14.35.30@2x.png

Adjusting the grid size, color, and Ruler settings

Section titled “Adjusting the grid size, color, and Ruler settings”

From within the Settings page, you can adjust the size of the grid, as well as the colors of both grid and rulers:

CleanShot 2023-11-01 at 14.03.07@2x.png