Skip to main content
Question

Keep color override when changing variant

  • June 2, 2025
  • 2 replies
  • 630 views
Bruno31

Hey everyone,

I saw that there has been quite a lot of related topics with this one, but most of them are a few years old, so I’m not sure if there’s a solution for this without any crazy workarounds…

 

I have this icon where I’m working with multiple brands, so for this I’m creating a variant that will allow me to easily swap between those brand and also the variable mode.

 

The issue comes when I’m using the icon from Brand X and change the colour from “fg-primary” to “fg-inverse”

 

If I change the Brand to Z, the colour doesn’t remain “fg-inverse” and uses the “fg-primary” instead

 

The icons have all the same structure

 

 

I want for the colour to remain the same when switching Brands. Is there anything I can do?

 

Thanks in advance!

This topic has been closed for replies.

2 replies

J
Figmate
  • Junko3
  • Figmate
  • June 6, 2025

Hi ​@Bruno31,

 

I understand you're looking to preserve a fill change when you select a different variant.

 

I see that the layer names of your current instance and the variant you're selecting already match.

Could you please also double-check if the original fill color matched between these variants?

 

If the original fill colors don't match, Figma won't preserve the fill change automatically. However, we can definitely wait for input on potential workarounds from our community!


To clarify, when you're selecting variants, Figma checks a couple of things, and if they're true, Figma will preserve your changes:

  • The layer names of the current instance and the variant you're selecting must match.
  • The layer properties you've changed (like fill color) must have originally matched between variants before you made the override.

You can find more details on this in our guide here: Change preservation 

 

Thanks,

Bruno31
  • Bruno31
  • Author
  • New Participant
  • June 6, 2025

Hi ​@Junko3 

I actually just noticed that if the icons have the same colours, this would be solved.

It would be great if Figma could check based on the variable used, instead of the actual colour, because in my case the only colour that both brands have in common is white, but I don’t want to put the icons in white by default. So the workaround is to have all of them at #000000, not using any variable, but will force the designers to always pick a variable afterwards.

Thanks :)

    Terms & ConditionsAccessibility statement