Transparency on colours within a gradient

[bmooij-lg]

Hey, @maxim-bazarov
(maxim-bazarov), maybe I'm missing something, but can I add opacity to a gradient colour (I want a gradient go from colour A 100% to colour A 0%, where 'A' is a token.
And the following only sets the gradient colour points on position 0 and 100 (as opposed to defining opacity):
linear-gradient(0deg, @token[colourA] 0, @token[colourA] 100);
I'm not aware of a way to add an opacity value for a specific colour in a gradient, although this is possible per colour within the sketch ui.

Note: I'm applying this directly to a shape, which is part of a symbol.

[MaxBazarov]

Hello. Please give me a small test file to verify.

[MaxBazarov]

@bmooij-lg
Just released 18.7.0
Now the plugin using 3d-party powerful library to parse gradients.

Please validate.

[bmooij-lg]

I'm not getting a fill at all anymore unfortunately (running the same test file)

[bmooij-lg]

And the 'failing setup' refuses to run. (no error, no response when selecting "apply" in puzzle tokens)

[bmooij-lg]

I've found a solution. I should have been using fade() to set the opacity of a colour from a variable.
So the following creates a gradient from a variable going from 100% to 0%

@token: {
colourA: #20CC20;
}
#gradients .shape {
background-color: linear-gradient(@token[colourA], fade(@token[colourA], 0%));
}

[MaxBazarov]

Also you can prepare color before gradient.
BTW, fade() needs opacity in decimal format.
Check my example.
https://github.com/ingrammicro/puzzle-tokens/blob/master/Styles/Releases/8.17.0/gradient-test.less