Re: [community-group] Gradient type feedback (#101)

I wanted to add to this discussion that the gradient types I've heard here are mostly linear by nature, even though the shapes can be defined as "linear", "conicol", "angular", "radial", "diamond", whatever, the color stops are a single dimensional array.

There are also types of gradient which I see used more and more in modern designs, which cannot be defined by a string enum to describe statically what the shape of the gradient looks like:
- Gradient meshes
- Freeform gradients
E.g. in Adobe Illustrator, example video: https://www.youtube.com/watch?v=fhB5tTTLqDU
Especially for freeform gradients, I can imagine huge platform-specific differences in how they are rendered, which is already a factor for simple gradients.

I think it would be smart to at least distinguish between these two types of gradients, once that have a standardized "shape" and those that do not. And at least not jam those two into the same token type 😅 .

For the standardized shapes gradients, the main thing I'm missing:
- color stops are defined on a 1 dimensional plane, so the angle of the gradient is not included, I think it makes sense that gradient stops have X Y and maybe even Z coordinates for 3D gradients, which could be used in 3D rendering software where 3D color interpolation is actually pretty common. This also means we don't need a separate "angle" property. I think this aligns more with how design tools currently let you work with gradients (Illustrator gradient tool, figma gradient paint)
- easing, e.g. a percentage or number between 0 and 1 that describes the relationship between 2 stops in how strong one is compared to the other, I wonder whether that should be defined inside the stops or in a sibling property that is indexed to the stops array somehow.


-- 
GitHub Notification of comment by jorenbroekema
Please view or discuss this issue at https://github.com/design-tokens/community-group/issues/101#issuecomment-2107257852 using your GitHub account


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Monday, 13 May 2024 10:52:01 UTC