2

I'm working on a web application where I need a bunch of random colors that are different from each other. Just for simplicity sake, let's say I want the user to input a number. This is the amount of columns that the web page should show, which are all right next to each other. Each column needs a different color.

What I kinda want to do is go through each color once, then start over with a different hue, like: red, blue, yellow, green, orange, cyan, purple, light red, light blue, etc.

My goal is to have each column stand out without reusing the same exact color. If a color has to be reused (red and light red), it should have a different enough hue to separate it from the original color. So #FF0000 and #FF0100 wont do.

Improve this question
4

1 Answer 1

Reset to default
4

If HSL is permitted, you can create a list of hues from the valid 0 to 359, with values that are separated by the amount of steps you feel, are perceptible.

You can do the same with saturation and lightness, and so, decide in which of them you will chose randomly, you can avoid repetition by updating the list, removing each value until the list get empty and need to be reseted.

Be aware that this will not result in all possible combinations and saturation will result in grays always if set to zero. You can limit the minimum saturation , and create other rules to work with a "grays colors category", and to guaranty all combination, you can follow a hierarchy, like, first remove all lightness values before removing one saturation and so on until removing the first hue, also to give more flexibility to randomization you can use lists of lists of lists to form sort of a tree hierarchy, so you will maintain states while randomly choosing at any of the levels.

Improve this answer