Skip to main content
Robert_Rutherford
May 6, 2021

Showing distance to objects while dragging

  • May 6, 2021
  • 18 replies
  • 18818 views

I know If I use the option key and hover, I get the distance between objects but I would like a feature that shows the distance exactly the way the option key does but without start making a copy of the element. If I start moving it I just want to see the distance to the element above for example. If I do this now it’s going to get to a point where it starts measuring from the copy I’m holding.

18 replies

Wolfgang_H
May 13, 2021

If you select the two layers you want, a little red line will appear halfway between them. You can drag that up and down to modify the space between them. You can also change the distance in the inspector. See image and tell me if that’s what you’re trying to do. I’ve just quickly drawn two rectangles and selected them to highlight the behavior. Unfortunately, this will only move the lower object, keeping the upper object in place.

Meowface_Sam
June 14, 2021

Please please tell me there is a way to always see the red distance-between-objects-measurement while I’m dragging them around.

Square #1 and square #2…
When I click on square #2 and drag it around, I see the wonderful red guidelines showing me the their edges are lined up, and, if I only had one wish in life, I would wish for the ability to also see the red distances between Figma objects WHILE I’m dragging them around. Yes, I know about the trick of selecting an object, hovering over to the other object and hitting Option and having the distance between pop up. That trick doesn’t solve the problem of us users being able to drag-n-drop objects next to each other at a desired exact measurement the FIRst time. If I want square #2 to be 364 pixels away from square #1, while I’m dragging square #2, I want to see the red numbers getting closer and closer to 364 and drop it down when it hits that number, not
guessing & checking,
guessing & checking,
guessing & checking.

Okay, you get it. Sorry for beating a dead horse. Sometimes I get responses that show me the person who read my question has no clue what I’m talking about, OR thinks I’m talking about something else.

I have a fantasy of dragging square #2 and simultaneously holding down “D” (for “distance”) and having that cute little red number grace me with its presence.

Tell me I don’t have to continue fantasizing or use up my only wish. Tell me there’s already an existing trick.
🐈

Gleb
Power Member
June 14, 2021

More discussions here:

Robert_Rutherford
June 14, 2021

Adobe XD is very good regarding measuring/distance/snapping. Figma would be the perfect tool with same functionality.

Uhl_TW
August 31, 2021

I can’t believe this doesn’t have more votes. I use the this all the time in Sketch and XD!

What they do is show the distance away, only when the dragged object is aligned (horizontally or vertically) to the nearest object. So not all the time so it’s not “noisy” and no need for modifier keys.

Be great if Figma added this. It already displays guides to show when something is aligned hor/vert, so just show a number for distance away on one of the lines.

Maybe something like this:

image

Robert_Rutherford
September 1, 2021

Exactly!

Peer_Guba
September 2, 2021

I have the same Problem and it kills me 😦

The only solution that partly satisfies me is this:

You can also adjust the nudge amount for keep jumps aligned with your spacing system, for example: 1px without shift key and 8px with shift key, has been very helpful to me. (menu > preferences > nudge amount)

TAVVA_BHARATH_BALARAM
March 1, 2022

Hey… Sam did you get the trick for the red lines auto dimensions thing… Please help me out

Figma1
April 7, 2022

Holding alt or option while dragging shows the automatic guides like you are wanting.

I saw it in a video here: UI Design a Smart Home app in Figma - Full Course - YouTube

However mine also duplicates the item…

I am not sure if that’s how that is supposed to work or not.

I will have to try it in the desktop app. Perhaps the function key is different online.

Figma1
April 7, 2022

Animationasdf2

When I hold alt (on windows) the guide shows. When I release it, it goes away. For some reason it also duplicates what I have selected.

Though when letting go, the original object goes away, so I guess if you don’t move the cursor it will still be at whatever the guide readout showed.