> Essays > coding > ColorList
> Essays > coding > ColorList
by ZweiBieren Making and Displaying
a List of colors
pens in a mug
named colors
An old list: with names atop their colors.

PiysPics offers color lists in several formats:

Being of temporarily unsound mind, I once decided to create a color chooser widget. And it was to allow choosing color by name as well as number, completely ignoring the fact that there are too many names and not enough really different colors. So I collected all the names I could. And there is no good order for a list of colors; so the list was the mishmash at the right; bright colors are scattered willy-nilly among the others.

A decade later my list still looked lousy and having too much else to do I decided to make a better list. By this time wikipedia had a much bigger list of colors, so I included them as well.

Various websites tried to convince me of how foolish I was. For example, sorting colors is messy at best and using Principal Component Algorithm (PCA) to sort colors. I got excited about PCA, but eventually it was a disappointment. This should not have been surprising. PCA would be trying to draw a single one-dimensional line through a cloud of points in three-dimensional {r,g,b} points.

named colors
One of the color-aray lists
generated by MakeColorPage

Eventually I treated the colors as hue-saturation-lightness values and sorted them by hue. Within each row I sorted them by lightness. This gave a much better result than any comination using saturation. The result is shown to the right. The names and values appear as the mouse is dragged over the array. Thanks to innovations in html 5, clicking a value on a popup copies that value into the cut buffer.

all colors, named & not
Page 120° (green) of pickcolor

Finally, I decided I wanted to position the named colors within the space of all colors. I chose a slider as a tools to scan through all hues (by 5 degree units) and laid out named colors and color background on 2-D grid. The 120 degree (green) page is shown to the right.

Sources: CSS colors, Wikipedia color list

Travis McGee novels have colors in all their titles. Nine are in the final list -- Brown, Cinnamon, Crimson, Green, Indigo, Pink, Purple, Scarlet, Turquoise -- but twelve are not -- Lonely Silver, Pale Gray, Quick Red, Empty Copper, Bright Orange, Dreadful Lemon, Fearful Yellow, Tan and Sandy, Deadly Shade of Gold, Darker than Amber, Deep Blue, Long Lavender. I tried and failed to find the courage to add them.

In converting between color codes, as rgb to hsl to hsb there comes a point where a floating point value, val, in [0.0, 1.0) must be converted to an integer range, say [0, upper]. (Usually [0,255] or [0,100]). Observing this, Marcus Erronius in response to https://stackoverflow.com/a/9493060/1614775 suggested

min(floor(val*(upper+1),upper)

However, I got better results with

(int)Math.floor(upper*val+.5)

The argument to floor is in the range [.5, upper+.5) and its result is in exactly [0,upper].

 
Copyright © 2023 ZweiBieren, All rights reserved. Mar 4, 2023 20:03 GMT Page maintained by ZweiBieren