Random Color Generator

Choose how many colors you want, a color style, and an optional harmony rule, then press Generate. Each color comes with its HEX, RGB, and HSL values and the nearest CSS color name.

Try a preset

About this random color generator

Random colors are useful for design inspiration, placeholder graphics, chart series, games, and test data. Choosing Any color picks each red, green, and blue value at random, so every one of the 16.7 million screen colors is equally likely. The other styles limit the hue, saturation, and lightness: pastel colors are light and soft, dark colors suit dark themes, warm and cool stay on their side of the color wheel, earth tones are muted browns and greens, and neon colors are fully saturated. With a harmony rule, the generator picks one random base color and builds the rest from it, so the set works as a palette. The colors come from your browser’s secure random number generator.

How to generate random colors

  1. Choose how many. Enter a number from 1 to 20, or press a preset such as Soft palette or Neon mix.
  2. Pick a style and harmony. Choose a color style, and a harmony rule if the colors should match each other. Leave None for fully independent colors.
  3. Generate and copy. Press Generate colors. Click a swatch to copy its hex code, or choose an export format to copy all the colors at once. Press the button again for a new set.

Frequently asked questions

How random are the colors?

They are drawn with the Web Crypto API, the same secure source used for passwords, so no color or pattern is favored. In the Any color style, all 16,777,216 hex colors are equally likely.

What does the harmony rule change?

With None, every color is picked on its own. With a rule such as triadic, one random base color is picked and the others are placed at fixed angles on the color wheel, so they look like a planned palette.

What happens when I ask for more colors than the harmony has?

The pattern repeats with lighter and darker versions. A triadic set of six colors, for example, gives the three triadic hues and then a slightly lighter or darker version of each.

What does the color name mean?

It is the closest of the 148 named CSS colors, such as coral or slategray. It helps you describe a color, but the hex code is the exact value.

Can I get the same colors again?

No. Each press creates a new set and nothing is saved, so copy or export colors you like before generating again.