Skip to main content
Solved

Instance swap not honouring new scaled size


Hi Figma Community!

Basically, I have a bunch of one size icons as variants in a component - they all have an auto layout frame applied to them.

I want to use the icons throughout my design, but in different sizes. However, I don’t want to create varying sizes within the main component, as there would be too many icons and it would look messy.

So what I normally do is:

  1. Create another test component using the icon with another element (for example, with a CTA here)
  2. Scale the icon using the scale tool (larger as an example here)
  3. Then instance swap it and it usually adheres to the new scaled size that I give it.

However, recently, this method hasn’t been working and the instance just retains the same size as its original parent varient.

*As a note, the icon starts scaling properly if I detatch the instance. Which ideally I don’t want to be doing, as I may have changes to the test component that I need reflected throughout the file.

Can anyone assist in finding why this is, that would be much appreciated!

Best answer by Tommy_Dinh

The Figma team have told me it’s a known issue James, but they haven’t created a solution as of yet.

I think it has something to do with the complex nature of the icons itself (they were made in Illustrator with many separate vector parts), because if I use icons from the Google Materials plugin, instance swap honours to the new scaled size.

View original

Celine_
Figmate
  • Community Support
  • August 18, 2023

Hi @Tommy_Dinh ,
I see in our backend that you have already filed a ticket to our support team and they have replied you. Feel free to send them a copy of your file so they can try to replicate.

Do not hesitate to share a quick video of the issue so we can better visualize the issue! 🙂


James_Lawrie

what was the outcome to this as I am having the same issues


The Figma team have told me it’s a known issue James, but they haven’t created a solution as of yet.

I think it has something to do with the complex nature of the icons itself (they were made in Illustrator with many separate vector parts), because if I use icons from the Google Materials plugin, instance swap honours to the new scaled size.


Karen_Beal
  • Active Member
  • November 23, 2023

I am having the same issue. I have made a set of icons – based on the Material Icon set, but renamed and adjusted for my needs. When I use an icon in a component set, for example for a header component that has different sizes for small, medium and large, when swapping the icon in the instance the size of the icon doesn’t change. The content ‘box’/frame’ is the same size but the icon inside reverts to the original icon component size. Not sure I have explained that correctly. The icon ‘vector’ inside reverts to the original component size within a correctly resized component ‘frame’. Not sure what I am doing wrong.

If I use the Material Design icon set directly, it keeps the size but not my colour changes! Also I don’t want so much padding inside my icons for alignment purposes so this isn’t workng for me either!


Karen_Beal
  • Active Member
  • November 23, 2023

I have fixed it for my purpose, basically the icons were strokes so I had to flatten them, and then make sure the icon itself was set to scale as well as the component frame set to scale. Now it works.


Awesome Karen, thanks for letting us know!


Almost a year later and Figma is still ignoring this.


Luke34
  • September 14, 2024

Sept 2024, just encountering this issue too. I have a component, it has three variants inside. I put an instance of the component in my frame, by default it’s on variant 1. Scale (K) up the instance. Set the instance to show variant 2 OR 3, and neither have the new scale of the overall instance. Figma 😡


Luke34
  • September 14, 2024

I still don’t understand how Figma became the darling of the world. It’s fails in SO MANY situations of baseline prototype/design needs…


Karen_Beal
  • Active Member
  • October 16, 2024

I have a component using an icons which has three options as component properties in a library. When I use the icons in a component in my design file, it swaps properly and keeps the component scale in the component, but component instances do not maintain the icon size when I swap the icon. I have it set up correctly but it’s just not working. Very frutrating!


Bruno_Biagioni_Neto

This happens here too, for all components we have to create a frame with auto-layout and zero padding to insert into a slot.


KatUX
  • New Member
  • May 8, 2025

I was having a similar issue with Icons.
I found that adding a max and min for height and width adding auto layout to the icons. The instance swap will honour the size. 


Reply


Cookie policy

We use cookies to enhance and personalize your experience. If you accept you agree to our full cookie policy. Learn more about our cookies.

 
Cookie settings