Skip to main content

So this boggles me.


Why can’t I change (override) the opacity of a referenced color-variable, without having to detach it? To me a color and an opacity value are two different things. So if I want an opacity on my referenced color e.g. “Blue-950” I have to detach it and change the value to my liking, now it is not referenced to the variable collection anymore.


A workaround is to add that “Blue-950” with the desired opacity in the variable collection and then reference that new “Blue-950-50-percent”.


It is so annoying that you can’t change opacity on the fly without loosing reference!!!

I get why that would be frustrating. Changing the opacity of a color variable directly without detaching it would be a useful feature. Currently, Figma doesn’t allow for overriding opacity directly on referenced color variables, which indeed forces you to either detach or create new variables for each opacity level.


Hey @Henrik_Andersen, thanks for the feedback!


@Alok is correct that this is currently expected behavior. I updated your topic for clarity, and we’ll pass this onto our team for future improvement.


Be sure to also vote up top! ☝️ Our teams use votes to gauge overall interest and prioritize.


Exactly, Needed this.

Thanks for raising it @Henrik_Andersen 🙌


Earlier opacity wasn’t handled very well over web. Now we can manage it in strokes and fill easily, without worrying about interactions/animations.

So I believe this can help in managing design systems by allowing opacity overriding for color tokens.


Reply