Random Color Generator

What this tool is used for

• Breaking out of a habitual palette by starting from something unexpected.
• Generating distinct colours for a chart series during prototyping.
• Producing placeholder colours for a mockup before the palette is decided.
• Filling a design system's swatch grid with candidates to react to.
• Getting a starting point you then adjust rather than staring at a blank picker.

Frequently Asked Questions

Why do random colours look muddy?

Uniformly random RGB clusters around mid-grey, because most of the RGB cube is desaturated. Generating in HSL and fixing saturation and lightness gives far more usable results — this is why palette tools rarely draw from RGB directly.

Will a random colour meet accessibility contrast?

Usually not. WCAG requires 4.5:1 for normal text and 3:1 for large text, and a random pair clears that only occasionally. Always check the generated colour against your actual background rather than assuming.

What is the difference between HEX, RGB and HSL?

They describe the same sRGB colours in different coordinates. HEX and RGB are the same values in different notation; HSL re-parameterises them as hue, saturation and lightness, which is far easier to adjust deliberately.

What about OKLCH?

OKLCH is perceptually uniform, so equal numeric steps look like equal visual steps — which HSL does not deliver (HSL yellow at 50% lightness looks much brighter than HSL blue at 50%). It is the better space for generating consistent palettes.

How many distinct colours are there?

16,777,216 in 24-bit sRGB — 256 values per channel. Human vision distinguishes far fewer, and displays with wider gamuts such as Display P3 can show colours that fall outside sRGB entirely.

How do I get a colour guaranteed readable on white?

Constrain lightness rather than filtering afterwards. Below roughly 45% HSL lightness most hues clear 4.5:1 against white — though yellow and cyan must go darker still, because contrast follows luminance and the luminance formula weights green at 0.7152.

Why do independently random colours clash?

Because separate draws produce inconsistent lightness, and the eye reads that inconsistency as disorder rather than as variety. Fixing saturation and lightness while varying only hue is what makes a generated set look deliberate.

How do I generate a set of colours that work together?

Fix saturation and lightness and vary only the hue, ideally at even intervals around the wheel. Randomising all three channels independently is what produces a palette where nothing matches anything.

Common errors and gotchas

• Using a random colour without checking contrast, which frequently fails accessibility ratios.
• Generating a chart palette at random, where adjacent series end up indistinguishable.
• Assuming random means evenly distributed perceptually, which uniform RGB sampling is not.
• Shipping a random colour into a brand context where consistency is the whole point.
• Picking colours that clash for viewers with colour vision deficiency, which randomness makes likely.