Back to updates
Feature
Layout & design

Pinned ruler and crosshair

Pinned ruler and crosshair

<p id="">When you need to align elements on the Canvas, a new pinned ruler and crosshair can help you measure and control your layouts more precisely. With the pinned ruler, you can refer to a horizontal ruler—displayed at the bottom of the Canvas—at any time:</p><figure id="" class="w-richtext-figure-type-image w-richtext-align-fullwidth" style="max-width:2560px" data-rt-type="image" data-rt-align="fullwidth" data-rt-max-width="2560px"><div id=""><img src="<https://cdn.prod.website-files.com/64f9399ca7d13575ff21a675/66301911b187456218b38b32inline-pinned-ruler.webp>" loading="lazy" alt="A horizontal ruler is always-present at the bottom of the canvas, in this case showing a design that is 1400px wide." width="auto" height="auto" id=""></div></figure><p id="">For even more precise measurements, an optional crosshair gives you a dynamic vertical guide that intersects the pinned ruler. You can drag this crosshair along the Canvas:</p><figure id="" class="w-richtext-figure-type-image w-richtext-align-fullwidth" style="max-width:2560px" data-rt-type="image" data-rt-align="fullwidth" data-rt-max-width="2560px"><div id=""><img src="<https://cdn.prod.website-files.com/64f9399ca7d13575ff21a675/6630194e79c5bcfe4333c259inline-pinned-ruler-crosshair.webp>" loading="lazy" alt="The user's cursor is on a pink vertical line displayed on the canvas. It is aligned to a logo, tagline, and other design elements." width="auto" height="auto" id=""></div></figure><p id="">To enable rulers, open <strong id="">Canvas settings</strong> by clicking the canvas size (e.g., 1699 PX) in the top bar of the Designer, next to the various device breakpoints. From Canvas settings, choose a <strong id="">ruler option</strong>. You can instead press <strong id="">Shift + R</strong> on your keyboard to toggle rulers.</p><p id="">We hope this update helps you measure and align your designs more efficiently. Check out <a href="<https://university.webflow.com/lesson/canvas-settings>" id="">the documentation on Webflow University</a> to learn more about the pinned ruler and crosshair, as well as other Canvas settings.</p>


Launched on
April 30, 2024
Category
Layout & design

Related updates

Truncate long content with text overflow

Truncate long content with text overflow

Learn more
Text Decoration Styles

Text Decoration Styles

Learn more
New variable types: Number and Percentage

New variable types: Number and Percentage

Learn more
Component style variants is now available

Component style variants is now available

Learn more
Manage variables at scale with reordering and bulk actions

Manage variables at scale with reordering and bulk actions

Learn more
Drop shadow filters

Drop shadow filters

Learn more