A small control with practical consequences
Figma’s August release added two spacing modes to Auto Layout: Around and Evenly. The existing automatic spacing behaviour is now called Between. These names and behaviours correspond to familiar CSS distribution values, giving designers more precise control over how repeated items share free space inside a frame. It is a modest update, but one that can remove ambiguity during implementation.
Between, Around and Evenly
Between places equal gaps between items while leaving no automatic gap at the outer edges. Around gives each item equal space around itself, which produces half-sized gaps at the container edges. Evenly makes every gap identical, including the space before the first and after the last item. These patterns are useful for navigation, button groups, cards and other components that stretch across changing widths.
Why matching CSS terminology helps
A design handoff often loses information when a visual arrangement has no clear implementation rule. Developers may reproduce the screenshot with fixed gaps even though the designer intended flexible distribution. Using concepts that map directly to CSS makes the behaviour easier to communicate and more likely to survive across breakpoints. It also helps designers reason about a component as a system rather than a single frozen frame.
How to use the options well
Choose Between when the first and last items should align with the container edges. Choose Evenly when balanced outer margins are part of the rhythm. Around can work when each child should carry its own surrounding space, but its half-sized edge gaps may look unexpected in tightly aligned layouts. Test each choice at narrow and wide sizes, with long labels and with items added or removed.
What the update reveals
The boundary between design tools and browser layout models continues to narrow. That does not eliminate collaboration: real interfaces still have content constraints, minimum sizes and accessibility needs that a canvas cannot predict. But shared vocabulary makes those conversations shorter. The best outcome from this release is not a new dropdown; it is fewer designs that look responsive in a mockup but require guesswork in code.
Designers can test the distinction with a simple exercise: place three differently sized buttons in an Auto Layout frame, widen the frame and switch between the modes. Then inspect the corresponding browser layout with real text. The exercise reveals whether the desired rhythm belongs between items, at container edges or both. Recording that choice in component guidance prevents another designer from replacing a responsive rule with a fixed pixel value later.
