Joining you all to scream into the void at @Figma_Support that this issue really defeats the purpose and utility of nesting icon components. I’m using a base button component where if I change the instance of the icon in an instance of the core component and then swap another variant on the instance, the color of the icon reverts to the color it uses in the base component. I follow the flatten-and-naming pattern as described throughout this thread.
You should naming the layer inside the icon such as:
Icon component> Live area > Vector.
Keep all icon has the structure like this. ( Layer name is the same with Live area and the last is vector).
Hope it will help you
1 Like
The layer name in the icon component needs to be the same for each icon.
Hey, I have a complex indented components for my Design System and I still have the problem same if vector icon all have the same name.
1 Like
I am also having this issue. I have meticulously ensured that layer structures and layer names are all identical across variants, and across all icons. I am still getting icons not keeping their override colours when viewing in prototype mode.
Imagine the frustration of seeing people post “fixes” and “workarounds,” none of them working, and just having to accept that Figma don’t care and are perfectly happy to let designers look like fools showing stakeholders a prototype that looks like amateur hour.
I can confirmed that this solution worked for me. Thanks a ton.
Nope. Does not work for me even if the vector layers are one shape with the same name. This is a bug. @Figma_Support
Hi @Mani_Noroozi , can you share the file (or a copy of the file) with our support team? They can help fix this with you here.