Preserve child variants' properties when switching parent Variant's property


I’m creating complex and nested variants and I’ve been wondering if the following behavior is a bug or simply how Variants work, in which case I’d like to suggest some improvements.

Demo file to help

Let’s say I have a component, a button, with multiple states that are properties of a single Variant.

Now I have another Variant, in which my button is nested, that also has states (for example, a page with a light and dark version).

If I change the state of my button (child Variant) in an instance of the Page Variant, and then change a property of the parent, the child Variant reverts back to whatever set of properties it has in the master parent Variant.

It would be nice to preserve “overriden” properties of child variants when changing the parent Variant’s properties (if they match).

Hope the situation is clear! Cheers.



I’m working on form fields/inputs and have the same issue. Can’t think of a suitable workaround. I haven’t created a stripped down version as @Antoine 's is a good example, but here’s my full component structure:

Of course it would actually have a lot more variants but looking for a good solution going forward before filling it in.

Hi folks! Have you found a good workaround for this yet? Trying to do something similar using the Plugin API where I reset an instance’s mainComponent. Even when preserve the variantProperties of that instance, it doesn’t reset the children

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.

yes! it is! this is my issue
The modified variant cannot synchronize the configuration parameters of the parent variant - Interactive Components / Bugs - Figma Community Forum - Figma Community Forum