LAUNCHED: Bind color variables to gradients

While the use case you are bringing up is an important one, I think our issues are slightly different here. I want to reference variables to define the gradient style, while you want to define a gradient as a variable. I believe these are slightly different usecases, but equally valid!

Would appreciate if you voted up this issue too 🙂

Yes the issue are very similar, i’m fine with both as long as we can use variables with gradients.

Hi @Mark_McIntyre ,

Thank you for your feedback! You are right, we can’t at this moment.
As the Variable feature is still very new, we’re eager to hear from our community what would help make your experience using Variables even better. I will pass along to our team for consideration. 🙂

Can somebody share the announcement?

Following. This prevents me from using these features on many of our designs because many have some gradients.

Yes! I would also vouch for this

Variables awesome so far, can’t wait for a deeper integration with shadows, gradients, within a compound color style, etc. !

The way I would like to approach using Variables in gradients is this:

1. Have a list of opacities and positions (a ramp) as Number variables that I can reference
2. Reference and combine Color Variables with Opacity and Position Variables
3. Once the desired Gradient is created, we can lock it down as a Style.

Anyone else have thoughts on how they want to use it?

Plus one for gradients.
Allow the definition of the gradients directly within the variable + modes.

If that isn’t easy within the architecture the second thing I tried before googling is as follows:

• Specify the colours in variables (with modes)
• Create a colour style with the colour variables which has the ramp etc.
• Use the colour style in the file

당신은 천재이다. 나는 감탄했다.

Confirming my team needs this for our design system. With opacity fades too.

+1 on using variables in gradients.

For now, it is challenging to use gradients in terms of variables, but a style referencing a variable is valuable since gradients can change in light/dark themes or other themes.

The same could go for effects like shadows.

Ohh I’d love that. Sadly I’m out of votes so leaving a comment here instead 😃
+1

Where was it announced?

+1 for gradient variables

Having the ability to use variables as the points within a gradient would be very useful for my design system. I have a layout for palettes and clients where this would be useful.

Here: https://youtu.be/M0NU5QFLCl4?si=Cb1XoGTLpGIiqClj&t=2469

Isn’t this… obvious? 😀

we need this soon

yes, please!

Can’t wait for Figma to implement this! waits faster

Here is a solution using variables that mimics gradients: https://www.figma.com/community/file/1295349493892095561/gradients-with-variables

make it soon～～～～～～～

I want to:

• define a gradient variable as a that uses other color variables as color stops
• also want to apply an opacity for each color stop

Hey all this would be really rad +1 I’m running into this issue right now where I want to make everything based on a variable color but because gradients are a big part of the design i’m working on right now I can’t do this atm