Skip to main content

Hey Figma team,

I wanted to report a problem that’s been bugging our team for the past few months. 

We have an Icon Library in our design system, as well as a separate glyph library. These icons are used in different sizes across the product (16px, 24px, etc.). The master components of each icon and glyph contain elements which are all set to ‘scale’.

However, within our larger components, whenever we want to swap an instance of an icon with a different one from our library, the scaling (of dimensions, stroke width, and border radius) is not properly applied, resulting in a broken view. 

One example is:

  • We have a nested icon component scaled to 16x16px;
  • We replace the instance with another icon from either library (original component of which is 24x24 but all elements set to scale) and expect it to scale properly to the 16x16 dimensions. However, the swapped icon appears broken in terms of the scale of elements inside, stroke width and border radius;
  • We have to resort to a workaround like: 1) Detaching from the master components, 2) Resetting the icon to its original size, 3) Scaling it again to the desired size. Which works for now but it’s frustrating we can no longer make use of the flexibility of the overall component’s properties.

It would be great if these scaling issues are fixed in future updates.

Appreciate your time looking into this!

 

 

Hey Alex,
Thanks for sharing all the details — I understand how tricky this scaling behavior can be, especially with nested components!

I saw that you've already contacted our support team. (Your support ticket is  #1314238.) The agent is currently waiting for your response to continue the investigation. (For your information, once you respond, your support ticket will automatically re-open.)

If you can, please reply to the support ticket with a brief video recording showing the issue. Make sure the full Figma window is visible, including properties and layers panels with relevant layers expanded. This will help the team to reproduce and better understand what’s happening. Thanks again!


Hello!

I have the same issue, do you finally find a solution?

Thx !


Hey, problem seems to be solved with the latest update :)


@Julien Blanchet Nah the problem still exists. At least for me, the components in other states are still displayed in the original size when they are changed via the nested instances…


Hey ​@Robin B. , sorry to hear you are still having issue on your end. For visibility here, we are still waiting for ​@Alex A ‘s response for further investigation.

I’d recommend submitting a bug report directly so our support team can take a closer look and investigate the root cause on your end: Submit a bug report here

Please use your Figma email account,  and in the form, share a direct link to the file, and invite support-share@figma.com with "can edit" permission to your file so the team can look into this further. Note that users with @figma.com emails on your team do not count towards your billing. 

Thank you!


My bad, ​@Robin B. is right, the issue still exists… ​@Celine_ I will submit this bug report too


Hi everyone! Just wanted to share a quick update here for visibility in case others are running into something similar.

@Julien Blanchet, I saw that our technical specialist were able to take a closer look at your report. Here’s what they found:

This is a known issue we’re actively tracking: right now, when swapping nested instances, the scale factor isn’t being applied correctly. While the fix may take some time, here are some solutions that can help in the meantime:

  • Instead of using scale, try applying size overrides directly to the nested instances. As you mentioned, another way to have it work is to set auto layout on every variant, and detaching the instance causing the issue.

  • For the icon width specifically, we recommend having auto layout set to “hug” for all variants in your component set. Here's a video showing what that looks like in your example.

Thanks again for flagging this, and we really appreciate everyone’s patience as we work on a more permanent fix 🙏🏼


Hello team!
We’re having the same issue, causing a major problem with our workflows and prototypes. Is the team working on any long term solution? For us, it’s not scalable to detach the components causing the isue.

Thanks a lot!


Hi, I’m experiencing the same issue and is causing problems on the handoff. Please let us know when this will be fixed so we can have an estimated date/time.


I’m experiencing the same issue


Started happening to me as well today, very annoying.


It massacres multiple components on my side, especially when the items are hidden behind a boolean variable, I think. Or there is a component in between, meaning there is an icon, for example, which belongs to a molecule comtonent, which is then used in an organism. But it’s hard to find a rule.

 


Hey everyone, I completely understand your frustration, and I really appreciate you flagging this for us! I’ve shared this thread with our team so they’re aware of your feedback. While we don’t have an exact timeline for the fix yet, I can confirm that this work is being prioritized.

Thanks so much for your patience and understanding!


@Celine_  is there any update on this? Or at least a workaround? Design work needs to be done somehow, regardless.


My team is experiencing the same issue. We found a workaround: swapping the instance directly in the component and then copying it.

We ran into this with our modal component when switching illustrations. It’s a bit slower, but it prevents the component from detaching, so it works for us. 

It’s strange since it works in the component set, and when you detach the instance. But not in the instance itself.

I’m not sure if this applies to your case, but it might be worth trying to adjust it directly within the component.


hey! Any update regarding this? I see is an issue that was already flagged over 6 months ago! Library is braking the components, the scaling is not respected when I swap a nested component instance. Detaching the component is not a feasible solution. C’mon guys!


It’s been like this for months without a proper solution. We don’t need new features, we need tools that work pls!!! +++


Hi everyone, thank you again for your patience ! We know this has been a frustrating experience, and we appreciate all the detailed reports and workarounds you've shared.

 

I’ve checked internally and here’s the latest update:

1️⃣ Original issue (nested component scaling)

The team is still actively working on a fix for the initial scaling issue reported in this thread. There’s no confirmed ETA yet, but the work is ongoing and we’ll update you as soon as we have progress to share. 
 

2️⃣ New, closely related bug affecting some users

We’ve also identified a second, very similar issue that recently began affecting some files. This one is tied to a separate scale-related bug in component instances. A fix for this newer issue has already been shipped. 

If you believe you're running into this newer bug, please try the following steps:

  1. Refresh Figma. This will make sure you have the latest changes and our fix for this issue
  2. Use quick actions to repair component connections, and/or regenerate all instances on the affected instances
  3. Once the instances are repaired/regenerated, the issue should no longer occur.

Please note that quick actions can be accessed through the shortcut ctrl+k (Windows) or cmd+k (Mac).

Important:
If you're not experiencing this newer issue, you can safely ignore this workaround. It won’t fix the original bug. We’re sharing it here because both issues look very similar and may cause confusion.


If you’re unsure which case you fall under, feel free to reach out directly to our support team with a URL of your file, so they can take a closer look at it: Submit a bug report. 
Thanks again for your patience. We’ll keep this thread updated as soon as we have more to share.