Color function updates

[argyleink]

• adds new color functions
• adds new gradient keywords

[andreamah]

Do you have an example of hue and in in gradients? I wasn't able to find examples of them with a quick search.

[romainmenke]

https://www.w3.org/TR/css-images-4/#linear-gradients

.foo {
	background-image: linear-gradient(in oklch shorter hue 90deg, red 25% 50%, blue 70% 75%);
	background-image: linear-gradient(in oklab 90deg, red 25% 50%, blue 70% 75%);
	background-image: linear-gradient(in hsl longer hue 90deg, red 25% 50%, blue 70% 75%);
	background-image: linear-gradient(90deg in oklab, red 25% 50%, blue 70% 75%);
}

On MDN these are Hue interpolation method and Interpolation color space in the compat tables : https://developer.mozilla.org/en-US/docs/Web/CSS/gradient/linear-gradient

Docs and syntax haven't been updated yet.

[argyleink]

this web tool will help you try out the new syntax 🙂 https://gradient.style

here's an example that uses in and hue interpolation for a very simple and effective rainbow gradient