How to use Absolute Position within an Auto Layout frame in Figma

Oscar de la Hera Gomez
A flower that represents Figma with the text "Absolute Position within Auto Layout" beneath it.

A step by step guide on creating a UI element that uses absolute position within an auto-layout frame.

Step One: Create the Auto Layout Frame

A screenshot of Figma showing a frame that uses auto layout.

In Figma, create auto layout frame that will hold the UI element with the absolute position.

Step Two: Add the UI Element

A screenshot of Figma showing a frame that uses auto layout. A circle has been added that looks out of place.

Add the UI element that will have an absolute position to the auto layout frame.

Step Three: Activate Absolute Position

A screenshot of Figma showing a frame that uses auto layout. A circle has been added that looks out of place. We have highlighted the absolute position button that is found on the right menu side bar, on the top  right.

Click the Absolute Position button on the top right of the right side bar.

Step Four: Set the Absolute Position

A screenshot of Figma showing a frame that uses auto layout. A circle has been added that looks out of place. We have highlighted the x, y, width and height values that appear on the right menu side bar. Change these to change the absolute position.

Configure the absolute position of the UI element through the inputs on the right menu side bar or by clicking and dragging.

Looking to learn more about things you can do with Figma ?

Search our blog to find educational content on learning how to use Figma.

Any Questions?

We are actively looking for feedback on how to improve this resource. Please send us a note to inquiries@delasign.com with any thoughts or feedback you may have.
delasign logo

Book a Free Consultation.

An icon of an email.

Click here to email us.

Fill in the details below to book a free consultation or to let us know about something else. Whatever it is, we are here to help.

How can we help you ?

Contact Details