Skip to main content
MrPowers
New Member
October 5, 2026

Mesh gradient support with tokens

  • October 5, 2026
  • 0 replies
  • 4 views

Currently there is no way to make a tokenized mesh gradient with transparency.

👇 Sample code from a Claude mesh gradient maker, bound to Figma color variables. 

.mesh {
background:
radial-gradient(181.01% 100% at 0% 100%, var(--ramps-amethyst-08, #653FC6) 0%, rgba(101, 63, 198, 0.00) 100%),
radial-gradient(99% 99% at 100% 0%, var(--ramps-info-06, #88AEE4) 0%, rgba(136, 174, 228, 0.00) 100%),
var(--ramps-amethyst-02, #F0EBFF);
}

This is impossible in Figma due to the lake of transparency.

Once you use a tokenized color in a gradient, you completely lose the ability to make it transparent, without breaking it. Once you break it, light/dark modes no longer work.

Seems like it would be relatively simple to make a transparency dropdown next to the tokenized color.

Â