

RandomColor – a color generator for JavaScript - dmerfield
http://llllll.li/randomColor/

======
mxfh
Good library to begin with, but could do better on the perceived brightness.

Since HSV is NOT perceived as evenly distributed to the human eye along the
value(lightness) axis[1],

would recommend employing _chroma.js_ [2] which uses the HCL and CIE color
spaces, which in general yield more pleasing results for use in color scales.

[1] [http://vis4.net/blog/posts/avoid-equidistant-hsv-
colors/](http://vis4.net/blog/posts/avoid-equidistant-hsv-colors/)

[2] [https://github.com/gka/chroma.js](https://github.com/gka/chroma.js)

 _i want hue_ might be a bit of overkill though:
[http://tools.medialab.sciences-
po.fr/iwanthue/index.php](http://tools.medialab.sciences-
po.fr/iwanthue/index.php)

~~~
leeoniya
also check out
[http://alienryderflex.com/hsp.html](http://alienryderflex.com/hsp.html)

~~~
roryokane
That page has a nice graphic clearly showing the problems with HSV and HSL.
But the color scheme HSP it invents is not ideal. HUSL
([http://www.boronine.com/husl/](http://www.boronine.com/husl/)) is a strict
improvement, as you can see from its comparison table of HUSL vs. HSL. HSP
fixes the “lightness” problem with HSL, and HUSL fixes that as well as the
“hue uniformity” problem.

------
riffraff
Maybe of interest: colorbrewer palettes as included in D3.js, which is my goto
choice for colors

[http://bl.ocks.org/mbostock/5577023](http://bl.ocks.org/mbostock/5577023)

[https://github.com/mbostock/d3/tree/master/lib/colorbrewer](https://github.com/mbostock/d3/tree/master/lib/colorbrewer)

------
loopdoend
A really important thing for data-vis is generating distinguishably different
random colors. It'd be great to have a library that produces series of
distinguishable, pleasing colors.

~~~
pwg
Not a "library" but possibly worth a look:

"Picking a range of colors":
[http://wiki.tcl.tk/38935](http://wiki.tcl.tk/38935)

~~~
jacobolus
This is a bad approach, because HSV is not an appropriate color model for this
purpose.

~~~
pwg
How so? What would be an appropriate model, and why is HSV not appropriate?

~~~
roryokane
As the link says, “it's not perfect, as it doesn't take into account the
different visual acuity of the human eye in different color channels”. That is
why HSV is not appropriate – its H, S, and V scales are only approximations of
axes that categorize colors as humans perceive them. For instance, V (value)
roughly corresponds to how light or dark a color is, but blue with maximum V
is way darker than yellow with maximum V.

I don’t know what the best model is. HSL, at least, is a simple-to-understand
strict improvement over HSV. Other people in this thread are suggesting models
I don’t know much about like CIELAB and CIECAM02. A model I have used to
choose colors before, which is a variation of CIELUV and an improvement over
HSL, is HUSL: [http://www.boronine.com/husl/](http://www.boronine.com/husl/).

------
jbranchaud
Would it be possible to add a seed option so that you could request the same
set of random colors if needed?

~~~
tstrimple
It's using Math.random, so no it's not currently possible. You'd have to
replace the Math.random calls with something like this:
[https://github.com/davidbau/seedrandom](https://github.com/davidbau/seedrandom)

------
enscr
Related : "How to Generate Random Colors Programmatically"

[http://martin.ankerl.com/2009/12/09/how-to-create-random-
col...](http://martin.ankerl.com/2009/12/09/how-to-create-random-colors-
programmatically/)

------
bilalq
This is actually really cool. I can think of several practical applications
for this.

------
heydenberk
I wrote a general purpose (pseudo-)random value generation library[0] that
does random color generation[1] among lots of other capabilities. It'd be
interesting to see how you could use the mutator to implement some of this
functionality.

[0]
[https://github.com/heydenberk/stochator](https://github.com/heydenberk/stochator)
[1] [https://github.com/heydenberk/stochator#from-predefined-
sets](https://github.com/heydenberk/stochator#from-predefined-sets)

------
calineczka
I went with the approach of hardcoding few sets generated by
[http://tools.medialab.sciences-
po.fr/iwanthue/](http://tools.medialab.sciences-po.fr/iwanthue/) (which i
think already been covered on HN) in my app. Just one set when i need <= 5
colors, one for <= 20, 50 and 100. Oh, and alternative set with different
palette of colors when I need two diagrams on the same page. As a colorblind
person I must say I was very happy with the results.

------
leeoniya
"BRIGHT COLORS" and "DARK COLORS" overlap with several dark colors. pretty
much every color model gets brightness values that dont jive with perceptual
reality.

------
rhubarbcustard
This produces really nice colour sets, I'll definitely be using this to
generate some backgrounds for blog posts. Nice work and thanks for sharing.

------
bikamonki
Great job! I know need not to worry about font color just pick one that reads
fine for a given hue.

------
hcarvalhoalves
Supporting complementary / tertiary colors would make it even more useful.

------
sideproject
really like it. did some research before on how to generate colours that would
be good for some simple visualizations, but found it difficult. This is great
for a quick retrieval of colours that you can use!

------
betadreamer
Neat! I would love to see the math behind it.

~~~
tokenizerrr
Here you go:
[https://github.com/davidmerfield/RandomColor/blob/master/ran...](https://github.com/davidmerfield/RandomColor/blob/master/randomColor.js#L29)

------
kanakiyajay
Anyone looking for a single line code to generate a random hex color: var
randomColor = Math.floor(Math.random()*16777215).toString(16);

~~~
oneeyedpigeon
FYI that's almost the first thing mentioned in the article!

