macOS algorithm for color placement?

[Darkroom]

does there happen to be some well known, standard, staple of an algorithm for placing a color spectrum using it's RGB values and a desired height and width?

for example, in Adobe's creative suite apps (image attached) there is the color window. at the bottom of this window is a general color spectrum in rectangular form. assuming this isn't an image, how is it programmed? there is also white at the top and black at the bottom, which must also be taken into consideration. is this complicated or have i just not been thinking about it clearly?

another example would be apple's color picker panel. it's resizable. but how is the placement of millions of colors, all that have their own RGB values placed only given length and height of it's containing frame?

 

[robbieduncan]

I would deal with the left->right issue first (as the top to bottom is potentially not as hard). To move from left to right we need move the values of R G B around in such a way as all such combinations are covered. At the extremes of your image we have 255 0 0 (RGB order assuming values 0-255 for 8 bits per colour channel). About a third of the way along we seem to have 0 255 0 and 2 thirds we have 0 0 255.

A direct blend between these values would result in us blending up to get to 255 255 0 half way between 255 0 0 by gradually increasing the amount of green and then we would blend down to 0 255 0 by gradually decreasing the amount of red. The "step" to increase/decrease by can be calculated by a division of the width of the image/picker to be created.

Now that deals with the left/right quite well but leaves us with a problem: We always have a 0 for one component. We never have 255 128 163 for example. And clearly we never have 255 255 255 (white) or 0 0 0 (black). We can handle this by taking the above left->right blend as the middle row. We then need to blend up and down towards 255 255 255 (up) and down 0 0 0 (black). Again the step in value can be calculated using the height of the image/picker required.

Note that the left->right step is "constant". We increase/decrease each component by the same amount. For each x value the increment/decrement step will need to be calculated for each component on it's own.

Disclaimer: I have just come up with this in a few seconds by looking at the output. I've never tried this and I don't know how will this will actually replicate the image...

Edit to add: that's a CMYK picker, not RGB

 

[chown33]

The spectrum is an unwrapped HSL double hexcone:

http://en.wikipedia.org/wiki/HSL_and_HSV

The hue value goes from 359° at one end to 0° (red) at the other end.

I think the slider bars are also colored by varying the hue value from one end to the other end.