Create gradients from color library

This is messed up, yes. We lost a feature and the new variables also can’t be used inside gradients.

And not just gradients, if we want to create a special pairing to go with a brand color based on the brand color we have to dig through the styles, apply it, unlink it, then we can finally use the colors. Before this update we could just pick the library colors where the document colors are. And it made it easy to see what the hex values are. Styles, it’s all hidden behind some locked bubble that you can’t interact with other than to activate it. Annoying.

Figma stated that users can’t use complex color combinations, including Gradient and Color blending mode. But the style is the same as usual with the layout has been revamped a little bit.

Here are their words about this subject.

You can check out this post: https://help.figma.com/hc/en-us/articles/14506821864087-Overview-of-variables-collections-and-modes

Regarding creating a gradient style and adding it to the library, you can see the image below

Agreed, very annoying. A bunch of extra clicks for not even being able to replicate the workflow of selecting library colors when building gradients. Not a fan of the new color menus. 😕

Appreciate the insight to the changes, @Thong_Nguyen but I don’t think it fully captures the issue of this post.

I’ve stumbled on the same limitation as Alex, as before I could create custom gradients by using colors from a shared color library. The workflow isn’t associated in any way with variables, it’s more about the on-the-go gradient tab within the color picker panel.

There used to be a dropdown where it says “Document colors”, where you could select any shared library to get colors essentially from any other external document, which makes sense. The recent update is a huge step backwards which is all the more frustrating 😩

Could someone from @Figma_Support weigh in what’s the story?

Also, the “old” styles can’t have modes, so… is a half-implemented feature IMO. If they really want to use"dark/light" themes as use case for variables, well, it doesn’t work since also gradients, styles, shadows etc should be based on themes.

Amazing!! Thank you for letting us know!

As far as I can tell, this isn’t fixed.

Hey @Jerod_Guillen ,
As efrat_kovach said, a fix has been deployed last year. Can you try to clear out your cache and force-quit to see if that helps?

Still, if you are still encountering the issue, please reach out directly to the support team with a quick video recording and your laptop specs: here
Our support team can investigate it further. Thank you!

@Celine_Figma I understand that a fix was deployed, I’m still running into the issue. I have done a hard reload yet the gradient color selector still does not show the colors saved in my library. Please see the screenshots and let me know if the team requires additional information for investigation.

Hey @Sara_Anees ,
Thanks for flagging this! Not sure where the issue may come from here 🤔
It would be great to investigate it further with a copy of your file. I’ve forwarded your issue to our support team, you should have received my message via your email linked to your Figma account (sdxxxxx15@gxxxl.com, your ticket is #1069746). Please also share to the support team any screenshot, include a link to the file, and share it with support-share@figma.com as an Editor so they can take a closer look. Thank you!

@Celine_Figma VS gradient color selector library

This is my first time commenting on a Figma forum - the system did not allow me to embed two images in a single post. And now I have to wait 8 minutes to post the follow up… 😕 not ideal.

+1 Also have this issue. None of my colour styles are available in the gradient colour selection.

same issue here as Anthony19.

Same issue as Anthony19 as well.

The library is only visible under “custom” which is frustrating for the Engineers who have to match the hex code to the color token

@Celine_Figma – Seeing the same issue. This seems like a regression and I know what the issue is. Gradient panel will only show the color variable if it is scoped for all fills. Once I switched my scope to include all fills (even text), the variables appeared.

Hope this helps everyone!

Hey all,
Thanks for the additional details! I’ve reported this details to our internal team.

We confirm this is expected, styles can’t be applied to gradient stops.

I’ve also passed along your feedback as a feature request to our team for future consideration. Thank you everyone for flagging it, and sorry again for the confusion!

Thanks for the update! As a point of clarity, we’re not trying to apply styles to gradient stops—but rather trying to apply variables. Applying styles certainly wouldn’t make sense as it would lead to recursion (gradients styles applied within a gradient style). But variables can be added if the scopes are adjusted as I mentioned.