1. True. Maybe I could make it also disabled to restrict interacting with it altogether.
2. I didn't design the tool as a more serious colorpicker or color scheme generator, so I wasn't thinking about adding more advanced features.
3. I thought about adding a search box that would accept many possible color values as input, but I feel like, adding anything will make the design more cluttered at this point. So, for me, adding stuff is more of a design challenge than a technical one.
I was commenting based on the HSL values of the mentioned colors. At the time of creating this tool I really didn't care too much about using a more perception-aware color space. Doing it just based on HSL already seemed like a huge win. But I received similar feedback in the past, too. So thanks for pointing out. I'll maybe think about making it even better in this sense.
Interesting point. Maybe the user could toggle the animations on and off. But back then, I hadn't designed this tool with the idea of creating a standard-ish colorpicker in mind.
Note that their hue and lightness values are almost same. The only difference is saturation and that seems to be why they are on the same row, differentiated only by the saturation axis.
Good point, thanks for pointing it out. I think I was trying to deal with it, but for some reason I just let it be this way. Also contributions are welcome! :)
I think there's a misunderstanding there. Mediumturquoise and turquoise are both located above cyan, which means they are brighter as the vertical axis is the lightness.
Also, to answer your question, colors are sorted by their hue, saturation and lightness values. So, it's actually a 3D color visualizer, where one dimension (hue) is reduced into just a slider at the top, and the other two dimensions are represented in a 2D grid.
I'm not aware of an equivalent tool for Pantone colors. But it can be created using this very tool with a table of pantone colors instead of a table of named css colors that it uses now.
The idea was to create a tool to sort the named CSS colors in a way that it shows related colors together. So, next time I can't decide between a few CSS colors, I can just check them here side by side.
I've created this tool last summer, but I hadn't shared it here back then. It's a PWA that I made with pure JS.