Our design system uses themed gradients. Would be nice if they could be swapped as easily as the other colors.
52 Likes
Same boat, we can’t migrate our themes to variables because of themed gradients (gradients that use colors from other variants)
11 Likes
At least allowing variables in gradient fills
8 Likes
I guess this is related to this idea: Creating gradients based on color styles - #13 by Recep_Kutuk
1 Like
This is a must-have for design variables. Please add this ASAP
7 Likes
Is also a bug, because now we can’t apply gradients from shared libraries since the option is gone.
1 Like
Not the best solution but I usually solve it by playing with multiple layers and a mask.
You can still transform it in a component and re-use it from a project to another.
3 Likes
In the example above, the “color” layers are using styles and the gradient is masking the top color. Then you can decide to have a color underneath or not…
1 Like
We tried the same thing but we figured out that we often need to reposition the gradient based on usage and the mask method is really blocking on this.
1 Like
The variable gradient is in the Figma announcement. We need to wait for updates this year.
2 Likes
FYI, you can still modify the gradient as it’s not linked to a style or a variable. Just that the gradient itself isn’t tokenized… Will be better natively for sure 
Hey there! I was just playing around with variables and I realized that while it’s great that we can stack them on top of each other in Color Styles, I’m missing the ability to create gradients that reference variables. I tried to select a variable to place in a gradient, but it didn’t work.
I think it would be super useful if we could select a gradient and add as many break points as we want, then have these break points either reference a variable within our variable library or be a raw color value. This would be so powerful for masks and fades, and it would make it easier to update brand colors or reuse components in new projects. Do you think we could get this feature added? Let me know what you think!
2 Likes
they said it was not available for gradients, this is where styles should be still used. I hope in the future they’ll come with some upgrades as well.
They might have technical challenges to generate a potential clean code from variables in a gradient.
Update: it’s coming next, just announced
4 Likes
I asked for the same feature here: Allow referencing of color variables for points of gradient values - Share an idea - Figma Community Forum
Same problem here…
Is there any way to make gradients switch when moving a frame into a new variable-mode-section? Or to just apply variables to values from the Gradient? Another thing I tried was to add the gradients to different component variants. But again, as far as I know there is no way to make a component switch its variant based on variable mode values? I’d love if anybody could help or forward this “idea” if its not possible by now!
Great news, do you have the source of the announcement made by figma?
They announced it in one of the video at config but didn’t mention when though.
We can’t also use variables inside effects like shadows… which is another blocking missing feature because using modes for theming requires everywhere we can set a color should also allow a color variable
1 Like
Can somebody share the announcement?