Framer
  • Support
  • Using Framer
Framer
  • Learn
    • Speedruns
    • Starter Kit
    • Examples
    • Tutorials
    • Sessions
  • Teams
    • Teams
    • Enterprise
  • Pricing
  • Blog
  • Updates
  • Support
  • Support
  • Using Framer

Related Articles

  • Using Custom Fonts
  • Creating responsive designs
  • Default Components
  • Drawing Mode
  • Insert Menu

Rulers and Guides

You can use Framer’s rulers and guides to help position and align layers on the canvas.

A video showing how to set canvas guides

Rulers

Rulers show horizontal and vertical positions on the canvas.

Enabling Rulers from the top left menu

To show Rulers, click on Menu > View > Show Rulers, or press Control + R on Mac or Control + Shift + R on Windows. Repeat this command to hide the Rulers.

While Show Rulers is enabled, the Rulers will highlight the positions of any selected layers.

Guides

A guide is a fixed vertical or horizontal line that can help you position layers on the canvas. When a guide is present on the canvas, a dragging layer will snap to the guide.

Canvas guides around a Frame

Note: Guides are only visible when Show Rulers is enabled.

Using Guides

To create a guide, click on either the horizontal or vertical Ruler.

To delete a guide, right click the Guide and click Delete.

To select a guide, click on it.

To see the distance between a selected guide and another guide or layer, hold the Option key and hover over the second guide or layer.

To reposition a guide, click the guide and drag it to the new position. While dragging, guides will snap to the edges of layers.

Tip: To make fine adjustments to a guide's position, zoom in on the canvas before dragging.

Helpful?Was this article helpful?

0

0

Framer

  • Updates
  • Pricing
  • Tutorials
  • Teams
  • Enterprise
  • Blog
  • Motion

Platforms

  • Web
  • macOS
  • iOS
  • Android
  • Figma Importing
  • Sketch Importing
  • User Testing
  • Desktop PrototypingNew

Resources

  • Examples
  • Sessions
  • SpeedrunsNew
  • Packages
  • Volt
  • API
  • State of Prototyping
  • Wireframing Tool
  • Mockup Tool
  • Dictionary

About

  • Loupe
  • Community
  • Company
  • Careers
  • Security

Support

  • Using Framer
  • Accounts
  • Contact

  • Twitter
  • Discord
  • Dribbble

Copyright © 2021 Framer B.V.

  • Security
  • Terms of Service
  • Privacy Statement