Creating gradients based on color styles

I’m very surprised too that gradients based on color styles are still not implemented.
Every time we change a style color we have to go through hundreds of gradients manually to change them. This is such a no-go for a professional tool and I really hope this is going to be implemented soon.

Would be great to implement this. It would solve the problem of gradient colors not being able to be editable globally and also make the initial selection much easier

The color picker is in even a worse situation considering this request. The predefined color styles are hidden under the “library” tab with the latest update, and are unavailable when applying a gradient. So, let’s say you want to create a gradient that’s made of two color styles, you first have to create two rectangles filled with the desired colors in your design system and you have to use the color picker on these rectangles to create your gradient.

Since Figma is now focusing on the developers side, I will try to define what’s needed, in terms of CSS (and a little bit of SCSS)

:root {
  --color-1: #ff0000;
  --color-2: #0000ff;
}

Let’s say these are the colors in our design system. everything else will be defined by these variables and will automatically change when these values change.

.foo {
  background: linear-gradient(to bottom, var(--color-1), rgba(var(--color-2), 0.5));
}

Which should look like:

And in the color picker,

• if we want to use a custom color it can be like this:
  

  

• if we want to use a color style from the library, it can be like this:
  

  

Please think about this 🥺

Keeping this alive because I thought this would be a fairly obvious feature.

Any updates regarding this topic from Figma? I agree this is quite hard maintaining for design systems, where you need to create a lot of unnecessary styles just to have them as gradients.

Love the idea @Recep_Kutuk mocked up!

This is a must-have feature. Please implement it.

any updates?

this good. ✋

Hey all what is the status of this? Something like what @Recep_Kutuk suggested back in Jun 21 would be rad.

Yes please add this feature! This is literally a flaw in an otherwise well designed system.