Kelsea Coker
 · LX Designer

Use Guidelines for Pixel Perfect Alignment

You can use Guides in the Studio to align elements on the Canvas or to create guide templates that can be used across multiple pages and experiences.

Create a guide

  1. Drag your cursor from the top or left-hand ruler bar on the canvas

  2. Release your click when you are happy with the guides' alignment.

    While dragging and creating a guide, you'll notice numbers indicating the pixel placement on the canvas for more accurate alignment.

You'll notice guides appearing as you arrange objects on the canvas. These guides will help you snap objects to the center of your canvas and to each other. Using these guides you can easily snap objects to the center points on the canvas or to the midpoints or edges of other assets. Additionally, if you select an object and hold down the ‘OPT’ key on Mac or the ‘CTRL’ key on Windows, you will be able to see the exact distance that object is from surrounding assets or the edges of the canvas.

To move an existing guide:

  1. Double-click on the guide in the ruler bar to enter "Guide Mode".

  2. In Guide Mode, double-click on a guide to enter a specific X or Y coordinate for that guide.

In Guide Mode, you can also select multiple guides without having to worry about selecting other objects on the canvas. To select guides simply drag your cursor over the guides you wish to manipulate, hold down shift and click multiple guides, or hold CMD (CTRL on PC) to select the guides you would like to manipulate individually.

Copy/Paste guides

In Guide Mode, you can copy and paste guides to different pages and across experiences while in guide mode. This is a great feature if you have similar layouts for multiple pages and want to ensure your experience stays uniform.

Deleting a guide

  1. Double-click on the guide to enter "Guide Mode"

  2. Hit the delete key or drag the guide off the side of the canvas