Skip to main content
Pablo Pardo
New Member
October 16, 2026
Question

Nested instance loses all its settings when the parent variant or component changes, if its variant property is bound to a variable resolving to a non-default mode

A nested icon instance has its variant property (Environment = iOS / Android / Web) bound to a string variable, so it switches automatically with the variable mode. Inside the parent component, the icon has its own settings: width and height bound to a size variable, an explicit variable mode for color, and a layer name.

When the parent instance sits in a frame whose variable mode makes the icon resolve to a variant other than the one stored in the main component (e.g. Web instead of iOS), changing the parent’s variant drops every setting on the nested icon. Swapping the parent to another component does the same. The icon falls back to the raw icon component: default size, default color, default name.
 

Steps to reproduce:

  1. Create an icon component set with a variant property “Environment” (iOS, Android, Web).
  2. Create a string variable in a collection with modes iOS / Android / Web, whose values match the variant names.
  3. Create a parent component set with variants State = Start / Partial / Final. In each variant, place an icon instance, bind its Environment property to the variable, bind its width and height to a size variable, and set an explicit color mode on it.
  4. Place an instance of State = Start inside a frame with the variable collection set to Web mode. The icon displays correctly.
  5. Change State to Partial.


Expected: the icon keeps the size, color mode and name defined in the Partial main component, displayed in its Web variant.

Actual: the icon reverts to the raw Web variant: default size, default color, default name. All settings from the main component are lost.

Notes:

  • It does not happen when the frame is in the same mode as the variant stored in the main component (iOS in our case).
  • It does not happen if the parent variant is changed first and the frame’s mode is switched to Web afterward.
  • It happens both from the UI and from the Plugin API (setProperties and swapComponent).
  • Explicit overrides set on the nested icon by the user are lost too.
  • resetOverrides() on the parent or on the icon does not restore it.
  • Restructuring the variants doesn’t help (same layer names and order in all variants, or absolute positioning of the icon).
  • Fill overrides on vectors inside the icon do survive. Only settings on the icon instance itself are lost.
  • Workaround: switch the frame to the default mode, change the variant, then switch back. We also avoided variant changes by using boolean properties for the icon’s position.
     

1 reply

Jaycee Lewis
Figmate
Figmate
October 16, 2026

Hey hey ​@Pablo Pardo 🤩 Thanks for the detailed report. I’d like to get this to my resources. I’d like to front load my report and try to prevent some follow up.

Would you mind sharing your example file with support-share@figma.com? If your components reference other libraries or linked files, please make sure those are shared as well so our team can reproduce the behavior. You can DM me the link(s) and I’l include in my report.

Thank you! — Jaycee