@chrisdavidmills awesome!

I'm a little confused, as it seemed like all the colours added after the 'from' were named colours. But it could be anything, right?

One of my biggest annoyances is always being issued colours in hex format - so it'd be great to see an example where hsl() takes some hex value like #ff0080 and spits out the same colour albeit with maybe a change in luminance or something.

But also, TIL. This fixes exactly my annoyance, it would be cool to not always convert colours!

@sarajw That's correct — the origin color can be hex, named colors, any function, a CSS variable, even another relative color.

I do say that early on in the guide, but perhaps I should have varied the examples a bit more. I wanted to keep the early examples really simple to avoid making readers think of too many things at the same time when getting used to the syntax.

BUT, having colors delivered via hex codes is still super common, as your message attests. Could do with some examples?

@chrisdavidmills It's a great guide, I've definitely learned something!

But yes maybe if there's a section that does nothing but switch different formats in and out, rgb to hsl, hex to rgb, rgb to olch, or what have you.

Otherwise I find I'm forever visiting https://convertacolor.com - it's a cool site but it's a step I'll be happy to avoid from now on!

@chrisdavidmills Sorry reread your message - concrete example:

I get a hex value out of some random color picker: #8EAAA5

I'd like to use this colour, and get some darker versions of it as well.

So (hopefully I've got this right), I could do it like this:

```
--theme: hsl(from #8EAAA5 h s l);
--darker: hsl(from #8EAAA5 h s 50%); // #6E918B
--darkest: hsl(from #8EAAA5 h s 35%); // #4D6661
```

@sarajw Hey! that is totally cool with me.

I've not forgotten about the hex colors examples either; just snowed under with other stuff currently.

@chrisdavidmills I'm afraid at the last minute it's going to come out of my talk because I think I may have found a bug!

Seems like doing say `hsl(from Canvas 30 s l);` doesn't follow how Canvas (a system color) flips between near-white to near-black when `color-scheme` changes from light to dark.

Interesting though!

#CSS #IsItABug #OrIsItJustMe