tristen / hcl-picker

:art: Colorpicker for data

Colorpicker for data.

Contributing

npm install
npm start

Credit goes to Gregor Aisch and his excellent post on, How To Avoid Equidistant HSV Colors. To convert/generate colors in a programmatic way check out chroma.js.

hcl-picker's Issues

Sections of picker not showing

Transparent pallet underneath shows where parts of palette are supposed to be
(Tested in Chrome, Firefox and Safari on Mac OSX Yosemite)

Allow selecting color space

If I'm not mistaken, the picker uses the sRGB space, which results in very limited options e.g. at high chroma. If there was a dropdown to select others like AdobeRGB, it would be useful for a wider ranger of applications than selecting a web-safe color pallette.

Normalize config input

Ref #8

Settings are not preserved through the link

Using the color picker updates the address in the URL bar in real-time, but using that link to come back to the page doesn't restore the settings used. (I'm on Chrome v49)

Invalid Hex Code

http://tristen.ca/hcl-picker/#/hlc/14/1.12/182A38/F7B64A

The hex code "#-1A1A9" is not valid though the swatch shows correctly. It should be #005b52 based on the RGB value on the swatch.

License information missing

Hi,

I can't seem to see any license or copying information. Which license is the project under?

Cheers,
Andrew

Bad output

This can happen as cited by @dnomadb:

Hex UI tweak

It would be sweet if the hex values were in text boxes to make them easier to copy and paste. It's a would-be-nice, not a gotta-have-it.

Hue slider

@tristen, have you considered adding a hue slider? Here’s a mockup of what it might look like. Could be a very nice little feature to be able to get a wider variety of palettes.

Edit: UI wasn’t accurate, so I updated that.

Colors don't have fixed Hue, as they're supposed to

Consider the following scale: http://tristen.ca/hcl-picker/#/clh/5/1.16/560003/E2A58A

If the Hue slider is fixed, I expect all colors to have the same hue value. This isn't, however, what chroma.js tells me about the colors that the picker suggests:

console.log(chroma("#560003").hcl()); 
// [32.025259877450765, 42.92174912486389, 15.411936172871435]
console.log(chroma("#AF4737").hcl()); 
// [36.77725531337734, 51.75956722662115, 44.08773663134244]
console.log(chroma("#E2A58A").hcl()); 
// [50.11947447114051, 29.803701752508704, 72.83727863959362]

All HCL color components are different. Am I missing something?

Remove copy-all button if flash is not supported by client.

Large number of browser location changes

Possibly it's by design, but the http://tristen.ca/hcl-picker site does a pretty extreme number of location/history changes.

In less than 10 minutes clicking around the tool I got around 1700 items in my browser history, which is somewhat problematic if you use Chrome's terrible infinite scrolling history page.