Add Gradients as a variable type

Bumping. This shouldn’t be marked as “Launched”. Variables being applied in styles is great and there are a plethora of workarounds. But now that variables are directly syncing with developers and code, we need more flexibility to make variables viable a long term solution to our products.

So please. Continue fleshing out variables, like adding the ability to create variables that are themselves a gradient.

If anything, let us have a variable be multiple purpose between modes. Maybe for mode 1 it’s simply a colour variable, but let mode 2 be a string instead that is code for a gradient, and let Figma parse that? Then we’re still synced with our developers 1:1

Agree you should remove the Launch because it is not the case. And this is not a solution just a workaround.

+1 here - we need the ability to add gradients for themes.

This has not been launched. We still need the ability to host gradients in the variables i.e. for some brands, the buttons use a gradient and for others, a solid fill. This is just a workaround and doesn’t offer any real value to this particular issue

Checkout maybe this kind of solution

https://www.figma.com/community/file/1295349493892095561

+1 for the need to set a gradient as a variable

Also, setting an opacity to a variable

Also looking for this. We sync variables to code and are maintaining gradients as both a string variable and an effect right now. It would be much simpler to manage this all as variables. Is there a reason that effects and variables are independent? I’d understand if there was an architecture decision that has been made that variables are only to represent “primitive” key / value pairs. It’d just be nice to know if this is under consideration or not.

​@Celine_D Please let’s make this a thing. :) 

Figma has already halfway towards this by accepting variables in gradients. Please also include the gradients as variables. This will make our design system simpler as we have, for example, special buttons in linear gradient (primary/500 to secondary/500), and normal buttons in surface/action (primary/500).

For anyone that wants to replace colors inside of a gradient / text field / drop/inner shadow like figma currently can’t: https://github.com/nimbling/Nimbling_Scripts#replacer-for-figma (It’s under review by the addons team, I just submitted it).