As the HSL vals presumably cycle through the rainbow, and there are 7 cardinal colors in that proverbial array of hues (ROYGBIV), the distance between each one, from 0 to 360, should be 51 or 52. So why do the colors here not correspond to what one would expect?
HTML
<p class="red">rot</p>
<p class="orange">arnj</p>
<p class="yellow">yaller</p>
<p class="green">green</p>
<p class="blue">bloo</p>
<p class="indigo">indiglo</p>
<p class="violet">violence</p>
CSS
.red {
color: hsl(0, 100%, 50%);
}
.orange {
color: hsl(51, 100%, 50%);
}
.yellow {
color: hsl(103, 100%, 50%);
}
.green {
color: hsl(154, 100%, 50%);
}
.blue {
color: hsl(206, 100%, 50%);
}
.indigo {
color: hsl(257, 100%, 50%);
}
.violet {
color: hsl(309, 100%, 50%);
}
see http://jsfiddle.net/NvTvr/
Perhaps the assumption that the canonical colors are equidistant from one another was faulty; if such is the case (and it seems to be), what is the accepted hue value for true blue (and the rest of the gang)?
The naked eye says 30 is about right for orange, and 60 about right for yellow; the rest seem okay as-is.
UPDATE
These values (0,25,50,100,200,250,300) are more like what I think of when I hear those color's names:
http://jsfiddle.net/NvTvr/2/
UPDATE 2
I fiddled around again, this time using John's vals: http://jsfiddle.net/NvTvr/7/