A color you
didn't think of.
Hex, RGB, HSL — single colors or harmonious palettes. Lock the swatches you like, regenerate the rest, copy any value with one tap.
Settings
About this generator
The naïve random color generator is six hex digits, randomized. The result is a slurry of muddy mid-tones, occasional fluorescent yellow, and very few colors anyone would actually use. Sampling RGB uniformly is geometrically unfair: the human-perceptible "good colors" make up a thin band of the full RGB cube, and pure random lands in the cube's interior almost every time.
This generator samples in HSL instead. Hue rotates freely 0–360, but saturation and lightness are clamped to the ranges you set in the panel — defaults of 35–85 saturation and 35–70 lightness produce colors that feel like colors. Then we convert to hex and RGB on the way out. The five harmony modes are old-school color-theory recipes: complementary rotates the hue 180 degrees, analogous nudges plus and minus 30, triadic carves the wheel into thirds, monochromatic stays on the same hue and varies lightness alone.
The lock-and-regenerate flow is the part designers actually want. Find a swatch you like, click the lock, regenerate. The rest of the palette rebuilds around the locked color — useful when you have a brand color you cannot move, or you are matching a photo. Click any swatch to copy its hex; click the RGB or HSL line below it to copy that format instead. The whole palette URL-encodes, so a moodboard you generated on Tuesday is one bookmark away forever.
Our take: harmony rules are training wheels. They produce palettes that look like palettes — safe, balanced, slightly boring. Real brand color systems break harmony deliberately, then enforce contrast with type and spacing. Use the harmony modes as a starting point, then unlock the dull swatch and regenerate it three times. The fourth try is usually the one. If you want a palette built around a single color you found in a movie poster or a book cover, paste the hex into the URL and lock it.
What people actually use it for
Five places this gets opened daily.
Design moodboards
Generate ten palettes, pick three you like, drop them on the canvas. Faster than scrolling Coolors and the URL means the palette comes home with you.
Brand brainstorming
Lock the founder's hex, generate four siblings, evaluate. Repeat with different harmony modes until the system feels right.
CSS scaffolding
Copy as CSS variables to drop straight into a stylesheet. Useful for prototypes where the color system is "we'll fix it later."
Kids learning colors
Single-color mode. Press generate, name the color out loud. Five minutes a day, surprisingly effective.
Art prompts
Three random colors, paint with only those. The constraint is the assignment.
Game UI placeholders
Need ten faction colors that don't clash? Triadic mode, regenerate, lock the keepers, repeat until you have ten.
How it works
The picking
Each color is built from three numbers: hue (0–360), saturation (your range), and lightness (your range). We pull each from crypto.getRandomValues with rejection sampling so every value in the range is exactly equally probable — a naïve random % N would slightly bias toward smaller values when N does not divide evenly into 2³². Then we convert HSL to hex and RGB for display.
Harmony modes
Pick a base hue at random. Complementary: base + 180. Analogous: base, ±30, ±60. Triadic: base, +120, +240, plus two filler tones with the same hue and shifted lightness. Monochromatic: lock hue, vary saturation and lightness. The base is rerolled on every regenerate unless you have it locked.
State & sharing
Mode, harmony, ranges, and the current palette serialize into the URL query string (?mode=palette&p=e63946,…) and mirror to localStorage. Loading the URL anywhere recreates the exact palette. Recent palettes (last ten) save locally and re-render as small swatch chips above the settings.
Common questions
How is this different from just picking #RRGGBB at random?
Pure hex randomness gives you mostly muddy mid-grays with the occasional bright accident. We sample in HSL space with constrained saturation and lightness ranges, then convert. The result is colors that look like colors — usable on a screen, not the noise floor of a calibration test.
What do the harmony modes do?
Pick a base color, then build the rest of the palette by rotating the hue. Complementary is 180° away. Analogous is ±30°. Triadic is 120° thirds. Monochromatic stays on the same hue and varies lightness. They are starting points, not laws — designers ignore them constantly and so should you.
Can I lock a swatch I like and regenerate the rest?
Yes. Click the lock icon on any swatch and the next regenerate keeps that color while replacing the rest. Useful for building a palette around a brand color or a photo you are matching.
How do I copy the hex code?
Click any swatch and the hex copies to your clipboard. The label below also shows RGB and HSL — clicking those copies the value in that format. Copy all in the toolbar copies the whole palette as comma-separated hex.
What does the contrast note mean?
When you generate a palette, we calculate the WCAG contrast ratio of each swatch against white and against black, and tag whichever passes AA for body text (4.5:1 or higher). It is a fast sanity check before you ship the palette into a website.
Can I share or save a palette?
The palette is encoded into the URL. Copy the URL bar (or the Share URL button) and the same five colors load anywhere — no account, no servers. Your last ten palettes also save locally for the next visit.
Are these colors safe to use commercially?
Colors cannot be copyrighted, so yes. The exception is full brand systems (Tiffany Blue, Cadbury Purple) which are trademarked when used in a specific context. Random color, used your way, is yours.
Related generators
Adjacent prompts, same speed.