color.js icon indicating copy to clipboard operation
color.js copied to clipboard

Supported Color Spaces diagram is terribly out of date and is missing several color spaces

Open gmcusaro opened this issue 2 years ago • 5 comments

In Supported Color Spaces the space Lab D65 is missing in the diagram.

gmcusaro avatar Mar 20 '23 14:03 gmcusaro

Assingning @LeaVerou as she made the original diagram

svgeesus avatar Jun 06 '23 21:06 svgeesus

I took a stab at using MermaidJS to generate the diagram automatically, but it looks quite ugly: https://codepen.io/leaverou/pen/xxNEqXX

Someone on Mastodon suggested the Mindmap type will produce better results: https://front-end.social/@[email protected]/112500397685069990

And someone on Twitter suggested I try D2 which seems to be more customizable and has a more reasonable syntax: https://play.d2lang.com/?script=qlDQtVOo5AIEAAD__w%3D%3D&

LeaVerou avatar May 25 '24 17:05 LeaVerou

I use Mermaid to create a color space mapping, you can control the output more than you think: https://facelessuser.github.io/coloraide/colors/#color-space-map.

With that said, using something else is fine too.

facelessuser avatar May 25 '24 17:05 facelessuser

I use Mermaid to create a color space mapping, you can control the output more than you think: facelessuser.github.io/coloraide/colors/#color-space-map.

With that said, using something else is fine too.

That looks better but still not great, it's way too spread out. How did you get it to draw some nodes above and some below?

LeaVerou avatar May 25 '24 20:05 LeaVerou

You can't explicitly control what distance a block is from another, but you can control the direction in a positive or negative way. See the source.

https://github.com/facelessuser/coloraide/blob/main/docs/src/markdown/colors/index.md#color-space-map

facelessuser avatar May 25 '24 21:05 facelessuser