Scale as a property

Thank you!! :clap: :clap: :clap: This solved my issue

This would be SO useful. Especially for prototyping any zoom/scale UI.

1 Like

Warning: noob comments below :slight_smile:

Yes. This.
Scaling seems to occur from the TL corner by default.
As a noob, I may be misusing the term, but I am truing to make a variant that has been enlarged using the handles… and animating between (effectively a scale), and no matter what I try, the animation is anchored to the TL of the default variant.

I hope there is a way… (sort of an “action center”???)

What needs to be rethought is the entire notion of properties.

They should not exist (this will confuse so many people)…

Everything should be a behavior. There are monumentally good reasons for this.

You just need to add a hug content to each individual icon size and that will prevent the icon from being resized through the master component.

1 Like

Hey Ben! i’m struggling with exactly the same issue - Read through all these comments here but doesnt seem like it got fixed…did you figure it out somewhere else?

Did anyone figure out a fix for this? Here is a screenshot from the master icon library file i’m using where you can see the layers. If I should adapt the master icons, please let me know what I should do.

2 Likes

replying so this doesn’t close

+1, I have icons at 24px with an intent to scale uniformly, but where I’ve used stroke inside boolean operations (to preserve editability), these aren’t scaling while in a swapped and nested instance.

Hopefully it’s clear in these images; the icon is scaled to 32px using the scale tool, but when swapped, the stroke weights are not scaled.


2 Likes

Yes, I need this (or similar) or I’ll be unnecessarily duplicating (or flattening) an icon library for the sake of strokes that don’t scale.

I use booleans to preserve underlying strokes but these don’t scale when in swapped and nested instances.

This is a serious issue that seems to be re-introduced with recent updates. I believe there is something happening when there are nested variants inside of a new master component. See video:

2 Likes

Those familiar with the Principle for Mac application will be familiar with the coveted Scale feature. It’s as simple as that :wink:

But what I like about Figma, and what Principle for Mac doesn’t have, is that you can scale by changing the width or height, which automatically calculates the scale value.

Has anybody fixed this? I am having similar issue. Creating different sizes for each icon with a variant is not an option for me due to extensive icon library.

3 Likes

I was able to fix this using these steps:

  1. Select all the individual strokes that make up my icon
  2. Do a union selection to convert them into one single layer/object
  3. Right click or Shift + Cmd + O to outline the strokes
  4. Set the layer to scale within the component frame

After that, any instances of that icon component scaled correctly by changing the stroke width as well.

It would also be awesome if the scaled amount was visible in Dev Mode! My team has a need to have certain UI components that have a designated size be “scaled larger” in some designs/use cases, and being able to have that scale change be easy to see for developers would be amazing.

Currently seems that stroke, text size and effects inside nested components are resetting to their default state defined in the master component.
Even after recent Figma bugfix that fixed issues with absolute position on scaled components in auto-layout, this issue still persists.

your comments are always helpful.
I can’t imagine how you’ve sorted this out but thanks!

I agree 100% with this suggestion. I might add the inking point for scaling so it doesn’t have to be done from the center.

I have many occasions where I could use this feature.

bump, please.