Colors for a diagram with unknown number of categories

Question

I have to draw a diagram for dynamic data. Each category should have a different color, but I don't know how many categories the diagram is going to show.

I expect this number typically to be between 5 and 10, but more or less is possible. Is there a strategy for choosing the diagram colors in this case, so that

• they are distinguishable,
• they do not hurt the eye,
• they do not create affiliations where there are none?

I thought of the following:

• Choose one color and use tints/shades

  PRO: fits in well with the rest of the website

  CON: hard to distinguish

• Choose a few colors and use tints/shades

  PRO: fits in well with the rest of the website, probably enough colors to be distinguishable for the expected amount of categories

  CON: the different colors impose an unwanted meaning, e.g. greenish categories somehow belong together and are different from blueish categories

• Choose a few colors and use additional patterns

  PRO: like the above

  CON: like the above, with meaning not only in colors but also in patterns

• Choose a few colors and repeat

  PRO: fits in well with the rest of the website

  CON: one color stands for multiple categories

• Try to find different colors for all categories (speaking of hues)

  PRO: distinguishable for the expected amount of categories

  CON: off-putting, not easy to calculate

There must be an approach to this problem? I've been searching and thinking for days, but couldn't find a satisfying solution.

You can think of the diagram as a (stacked) bar chart. Other types are possible, although I think this would not essentially change the question (or answers). Of course, the diagram will also be equipped with a legend and tooltips.

Answer 1

I did a very similar thing in a project of mine. In it, I used this color library to generate some colors for me. If you view the demo, you'll see the colors being used. It essentially does your second method, "Choose a few colors and use tints/shades".

To reduce the number of similar colors that are hard to distinguish, you can use an algorithm to see how close together they are and generate a new color for ones below a certain threshold (make sure that the threshold is actually achievable given the number of colors you need). You can find a very simple one (checking a linear difference, which isn't how we perceive color change^1,2, but is really easy to implement) in my color picker project.

You can also generate sub-sets of colors for related categories. Since you provide no information about said categories, it's hard to give advice as to how to do so.

---

But from a design perspective, I may not do it this way. It depends on the types of data that you have. If you have a set number of category always, I'd likely choose some set color palette and link each color to a category one-to-one. More details could be helpful in determining whether or not this is preferable.