How to Use Auto Layout in Figma

Select the frames or objects you want to include in your auto layout. Hold Shift and click multiple items, or drag a selection box around them.

Press Shift+A or go to the top toolbar and click the '+' icon next to Auto Layout. This wraps your selection in an auto layout frame.

In the right sidebar, adjust the Direction (Vertical or Horizontal). Vertical stacks items top-to-bottom, Horizontal arranges them left-to-right.

Set Spacing Between Items to control the gap between elements. Use consistent spacing (e.g., 8px, 16px) for a clean, organized layout.

Adjust Padding (Top, Right, Bottom, Left) to add space inside the frame. This creates breathing room around your content.

Set Resizing options: Choose 'Hug Contents' to shrink-wrap the frame around items, or 'Fixed Width/Height' for specific dimensions. Use 'Fill Container' for responsive child elements.

Add new elements by dragging them into the auto layout frame. They'll automatically snap into place with proper spacing. Reorder by dragging items up or down in the Layers panel.