Creating gradients based on color styles

I don’t know what you mean by this.
We want to use color styles as the stops in a gradient. It would be invaluable.
Creating gradients based on color stylesShare an idea

77 votes

Aug 2022 - Is there any way to use a “Color Style” in a gradient? I know I can make a “Color Style” that is a gradient, but I want to create a solid color that can be used both in solid fills and gradient fills.

Creating gradients based on colour stylesShare an idea

0 votes

5d - Hi all, I am new to Figma but I have a question is it possible to creating gradients based on colour styles, so no is it an idea to create this?

Create gradients based on color stylesShare an idea

1 vote

Dec 2021 - Need: Figma doesn’t allow to use of color styles for gradients. this is very non-scalable and creates issues when the user wants to bulk change the color of gradients. Proposal: Give an option to c…

Why won’t gradients created as color styles show up in files?Ask the communityJun 2022 - I’ve created a set of color styles in my library, including gradients, but only the solid fill colors appear as selectable in the style menu in any file that has the library linked. The gradients a…

How can I use color styles in gradients?Ask the communityMar 2022 - Is there any way to use a “Color Style” in a gradient? I know I can make a “Color Style” that is a gradient, but I want to create a solid color that can be used both in solid fills and gradient fills.

@nikolasklein Please help us get this back on the roadmap for discussions. Gradients are so important to the definition of style guides these days.

Yes I hope this comes into Figma as soon as possible as I work a lot with gradients, and I think this is an important part as gradients is also very beautiful and trending in designs

We need this feature as a community

the material theme builder creates allot of styles and allot of people are using this to create color pallets, other plugin also do this, but the material one is the one I use. Because you cant use color styles in Figma gradients allot of generated styles are not available to choose from. Which in turn creates the same issue described earlier in this thread, changing gradients is a p.i.t.a. Why is such a mundane feature not available even after 2+ years?

This is solved! I don’t know when this feature was added, but here’s how to do it:

If I understand correctly this is a different issue @rio. Of course please correct me, Rio or anyone else!

Being able to have a gradient defined as a color style in your library has been fixed as you demonstrated. However this thread is about being able to use color styles from one’s library as the gradient’s stops, ie: each of the specific colors within a gradient. Even though the color picker for a gradient stop does have a “Library” tab none of my and other folks’ color styles show up in it.

Somehow Material plugin created colors under a section called “Scheme” do show up, does anyone know where these come from?

For creating Gradients based on color styles you can choose Gradient Color Generator Tool, that is absolutely free to use.

+1 Please do it. Recoloring becomes a breeze.