New Participant

LAUNCHED: True Aspect Ratio Lock

Forum|Forum|5 years ago
January 23, 2021
214 replies
31503 views

Can we get a true aspect ratio lock when the ‘Constrain Proportions’ is on? WX20210123-114719@2x A true aspect ratio lock means two things:

When dragging on a node with ‘constrain proportions’, its width and height always stay in their original ratio no matter which direction you drag it.
When resizing on the parent of a node with ‘constrain proportions’ that happens to be constrained, the node takes on the smallest of its supposed width and height, and calculates its ratio accordingly.

This would be so very helpful to polygon shapes that want to stay in that shape. Consider a spider chart. When you resize its parent, you don’t want the ‘spider net’ to squish squash; neither will you want a doughnut to turn into an oval.

*Resizing of the node’s parent layer is inevitable if you need responsive designs.

Share an idea

Pinned Reply By Celine_

Hey everyone, thanks for your patience! It’s fully rolled out now!

You can now lock the aspect ratio of almost any object in Figma – including frames, shapes, images, videos, vectors, and text – so that the proportions of that object are respected as you scale the object or its parent container.

More info in the release notes here.

Ari

I feel like this is a must-have feature as it has been quite an issue in my project for me… especially being somewhat new to figma.

I’ve seen workarounds with adding a line at an angle using responsive layout, but it’s just a workaround and has quite a few limits.

Mr.BiscuitAuthor

New Participant

Exacto!

Marcelo_Davanzo

People work with images and this is super necessary in those cases. If I set my image container to a 16:9 aspect ratio when it’s 160x90px, I’d obviously expect it to be 320x180px when I scale it to twice the width, not 320x90px.

Chris_Doner

A big +1 from our team as well.

Asaad_Mahmood

Huge Huge +1

Valeo

Aspect ratio lock needed in auto layout and constraints, so block does not change proportions during scaling.

There is nothing to add here…

Baffour

Agreed, have this problem with SVGs in an auto layout. Sometimes have to resort to images, which makes hand off not as easy because devs should be using the SVG in code. Also have certain UI elements like charts I want to show in designs and the only way for them not to break is to copy as images which then means you lose the ability to inspect etc. Leads to a lot of busy work to find other means of communicating to engineers!

adamfishercox

Incredibly important feature that’s missing! Are there any plans to add this?

Adam

Right now, it is not possible to make a square frame that resizes via parent frame. It always distorts into a rectangle.

Even with “constrain proportions” toggle selected, it does not constrain the proportions. To make matters even worse, the toggle only “works” when changing the numeric fields of height/width, which then breaks snap-to-pixel-grid. But then when holding shift and dragging a corner of the frame, it constrains proportions and maintains the snap-to-pixel grid functionality.

I believe a toggle/option in the constraints panel (example: width = fill container, height = maintain proportions) could do the trick.