Skip to main content
madmonkey
Feb 9, 2021 2:24 PM UTC

Styles for Auto Layout

I’d love to have styles for the Auto Layout in the same way as Figma does for the grids/columns, typography, colors etc. Handy for making consistent containers. Think of changing padding globally for example.

What do you think?

Cheers

13 replies

Namik_Ozgur_Aydin
Feb 15, 2021 7:59 PM UTC

Hi Jan,
Toolabs DSM plugin creates tokens for auto layouts as well. And for paddings, the auto layout tokens uses spacing tokens. So, if you have more than one auto layout token, changing the spacing scale will be enough.

I hope it helps!

Figma - Toolabs Design System Manager | ✦ Design Tokens, Theme Management and more... Define or update design tokens in one single panel...

Diana_Schramm
Feb 16, 2021 4:32 PM UTC

Great feature! Helps me a lot!

madmonkey
madmonkeyAuthor
Feb 17, 2021 11:03 AM UTC

Hey @Namik_Ozgur_Aydin, it looks like a great plugin you made! I’ll give it a try. For now, I prefer a plugin-less (and no-extra-account) solution.

Dominic
Active Member
Sep 14, 2021 6:35 PM UTC
  1. …Or simply the ability to copy/paste Auto layout from one frame (or component) to another.

  2. Or ability to select multiple frames/components and have Auto layout affect inside each individually as opposed to the group. Similar to the Create multiple components feature we have now, but for Auto layout.
    (Although this idea could be more problematic in practice)

briankalwat
Sep 23, 2021 6:50 PM UTC

When working out layouts, it’d be helpful to be able to have Auto Layout “styles” that are reusable across a project - this would enable you to dial in different metrics and see how they effect various contexts.

Auto Layout Styles could work the same way that text styles, color styles, effect styles, and grid styles function - giving designers the ability to have presets of auto layout configurations.

Ilya_Lowda
Feb 8, 2022 4:15 PM UTC

Hello!

I am trying to create fully automated design-system that could be done almost just on styles and settings. Sometimes I have problems with remembering my design-system spaces. For example between the blocks on mock-up, or inside element as fields, tags and buttons. Also for developers it could be very useful. Before you had amazing grid styles but now with auto layouts this rules not working.

Снимок экрана 2022-02-08 в 18.10.15

On this picture we see that this auto layout have spaces 10px from all the sides. I want to make this spaces in styles and call “Button spaces” and they could be unremovable.

Thank you!

WHQ_Ep
Mar 14, 2022 6:47 PM UTC

Hi all, Agree here. We setup auto layout containers for our mockups. This would be a greatly appreciated addition to the styles in Figma natively. If you’re listening team Figma. Thanks!

Andre_Fisch
Nov 17, 2022 10:19 AM UTC

Hello guys,
i would love to have an option similar to an text or color style that you can set the spacing and connect them in the autolayouts.

Larry_Reynolds1
Nov 18, 2022 10:12 PM UTC

+1 for spacing tokens.

Petr_Hervy_Sazka
May 24, 2023 9:00 AM UTC

Please this is a must-have feature when you create a design system and want to connect it with existing projects. There is no easy way how to change padding in components using auto-layout (basically all of the components…).

We are using separators as components… but it is not native and kind of still not easy…