Hi, I really love iWantHue and the HCL color space. Thank you for this wonderful website.

I wanted to point out that the boundaries for C should be: MIN 0 to MAX 134.

I found out using the following code where I convert all possible RGB values to their HCL counterpart in order to calculate min max values for H,C and L:

min H := max double
min C := max double
min L := max double

max H := min double
max C := min double
max L := min double

for R := 0 to 255 do
for G := 0 to 255 do
for B := 0 to 255 do
  begin
      convert (R,G,B) to (H,C,L)

      min H := MIN( min H, H);
      min C := MIN( min C, C);
      min L := MIN( min L, L);

      max H := MAX( max H, H);
      max C := MAX( max C, C);
      max L := MAX( max L, L);
  end;

The current GUI lets you think that 100 is a maximum for C.

And when you select color space All colors it sets the C range to 0 - 100 whereas it should set it to 0 - 134.

The page on theory causes browsers to hang:

http://tools.medialab.sciences-po.fr/iwanthue/theory.php

Tested with Firefox 61.0.1 and Chrome 68.0.3440.106 (OS X).

Tested using Chrome 56.0.2924.76 or Firefox 53.0.2, the theory page never finishes loading because chroma.js gets caught in a loop. I'm not entirely sure where in the code this occurs, however.

Selecting Go for any example on the Experiment page referencing the Lab color space never reaches completion.

This is such a useful tool I find myself using it regularly. Is there any chance of an API so we could automate the process for non-javascript applications, or perhaps a R / Python version? I suspect most real data science happens off-browser..

When trying to use the palette correction tool (I realize there's a more modern interface, but this one better suits my purpose of trying to clean up a set of colors created by our graphic designer) I get the following error:

TypeError: lab is undefined
corrector.php (line 547, col 34)

I love this ... the only thing i miss is when i generate a new palette i want to see all the colors that are part of one color. Right now i can see the list of them as a blobs and if i hover over a color i see the color tool tip but i cant get access to the individual colors.

It would be nice to access all the colors that are part of a group as a list on their own. Hopefully we can see the sequential list as an array or one col multiple rows format as they do in colorbrewer.

Does it make sense ?

Hey,

I am working on a research project and would love to integrate your palette generator into my system. Everything will eventually be open source, but even then GPL can be very messy in an interpreted browser environment. According to some interpretations of GPL, it may even be unlawful to run GPL scripts in non-free browsers. Is there any chance you could offer chroma.palette-gen.js as something other than GPL? I see that the larger project is LGPL which would be better, but the GPL-specific heading in chroma.palette-gen.js overrides that, I think.

Cheers,

Isaac

If I try to "Make a pallete" when the range for "Chroma" is zero, the site stops responding.
I expected it to only generate the colors of that specific "Chroma".

The same happens with "Lightness".

I am using Windows 7 / Google Chrome.

Hi there. Is this project still being maintained, or shall we add a clarification to the repo main page?

The ns.diffSort function has a bug. The indicated code should be inside the loop above it. Otherwise, the loop above simply recomputes "d" several times and the only iteration has any subsequent effect.

ns.diffSort = function(colorsToSort, distanceType){
	// Sort
	var diffColors = [colorsToSort.shift()];
	while(colorsToSort.length>0){
		var index = -1;
		var maxDistance = -1;
		for(candidate_index=0; candidate_index<colorsToSort.length; candidate_index++){
			var d = Infinity;
			for(i=0; i<diffColors.length; i++){
				var colorA = colorsToSort[candidate_index].lab();
				var colorB = diffColors[i].lab();
				var d = ns.getColorDistance(colorA, colorB, distanceType);
				/* *** Code below belongs here *** */
			}
                            // **** BEGIN
			if(d > maxDistance){
				maxDistance = d;
				index = candidate_index;
			}
                            //**** END
		}
		var color = colorsToSort[index];
		diffColors.push(color);
		colorsToSort = colorsToSort.filter(function(c,i){return i!=index;});
	}
	return diffColors;
}

A lot of the scientists who I work with use MATLAB to plot data, I was wondering if it was worthwhile to include an output of the colours for MATLAB?

MATLAB colours are RGB and range from 0-1, you can easily convert from the RGB json values by dividing each by 255.

To make a cell array from this for MATLAB you would write something like:
{ [1,1,0] , [0,0.5,0.5], [0.5,0.75,0.1] }

Since there is space available on the webpage, it seems like an easy output to generate to reach a wider audience?

I am trying to get many (24) visually distinct colors with the same saturation and lightness.
This is probably borderline possible depending on the display.

In my case I don't even want a display but intend to use it for RGB LEDs, so the larger gamut might help.
I'd be willing to write a patch to have it support other display gamuts than what I assume is SRGB.

Any tips on where to start?

Is there any paper accompanying the project? I want to cite the website in a paper

Having found a great colour palette I want to share it with colleagues. I can cut-and-paste the values but it would be even better to sent them a URL that takes them to the palette inside the iWantHue site.

This may be a bit of a weird request, but I have a specific need to mostly-sort by hue, then by diff (actual sorting wouldn't work since all hue/chroma/lightness are likely to be unique).

I guess it could be implemented by limiting the significant digits being compared (maybe even allowing for control of that), then using diff as a secondary key.

I'm going to look into the source code myself to see if I can come up with a functional snippet that does what I want, to give a better example :)

Love the tool. It's an incredibly useful resource. I just came across a small bug in distance calculations with one particular color. It appears that #9549d0 is in some way an edge case in the Protanope calculations, because this RGB palette:

["#43d357",
"#9549d0",
"#bb4800",
"#1dcdff",
"#c20055"]

gives this output:

(note that all the Protanope distances involving #9549d0 result in NaNs, and all distances not involving that color return numbers as expected)

(the other distance sections have no NaNs in them)

Looking forward to the new version!

Each color has below the Hexa and RBV values. It would be nice if the HSL values where present too. I know one can get those in the HCL json block, but I think having them paired with each color would help picking up those that, f.i., have more similar luminosity.

Useful for designing against a background color.

Newer versions of chroma.js changes HCL representation (called LCH somewhy), same as in D3.js.
Updating the library will make colors with C=0 true grayscale instead of yellowish.

Any version of chroma.js >=0.4.8 will do.
Check the commit with mentioned changes at chroma.js repo: gka/chroma.js@42dd32a

The various links in the README to examples and the live tool should be updated.

Iwanthue is so nice , will anyone make a tutorial for using iwanthue use in R / ggplot2, thanks

Any chance this could be made available via an API? I'd love to write a R package so palettes can be programmatically generated.

It would be useful to be able to see the colors sorted by differentiation (or sorted by hue) in the demo site. This would aid designing color scales, also when color constraints are imposed.

H, C, L and number of colors in the palette inputs could be constrained to allowed values.
When you enter values with keyboard, you can enter values outside the range.

You've made some great examples of how the tool works, but I can't see a minimal example of javascript/css/html usage. Have I missed something?

I'm assuming there were intended to be images in the blank areas : there are none for me. I have latest chrome and safari on sierra.

Is it possible with iWantHue to pre-select 2 (or 1 or 3 or more) pastel colours and have a palette built around these? Thanks.

Do you have a Python module available? I'm very happy to write it, if it doesn't exist. Cheers.

On http://tools.medialab.sciences-po.fr/iwanthue/index.php, sorting (by "hue" for example) and removing a color does not remove the expected color (it removes the color that was at that position before sorting).

Pretty easy to reproduce with even 2 colors, so I don't think it's worth putting a screenshot.

Thanks.

It seems like a moderately difficult addition for great accessibility gain.

When invoking paletteGenerator.generate in the JS console, you can adjust the "quality" and "ultra_precision" parameters, however these can't be adjusted when using the web GUI. Can this be added, perhaps under an "advanced options" collapsible?

After ordering colours by hue, chroma, etc., clicking to edit a colour will not allow to edit the selected colour. Instead it will allow to edit the colour that would be in that position if it were ordered by diff.

Hey, I noticed that once I choose subset of colors by lock, then when I change sorting different colors are locked, i.e. lock position not followed sort - they stayed in the same wells.
This app is great though!

If you go to tutorials, and then click the "I want hue" link at the top nav, you get to the same page(tutorials)
Same with other pages

Consider the following color pairs and their distances:

cf5440 -- #c69141: 39.6

72893f -- #7b7eca: 85.4

The first pair appears (to me at least, and I think I have pretty normal vision) more different than the second pair, and yet the second pair has a much greater distance. What difference metric is used? Is it something like one of these algorithms, or is it something simpler?