Need a colour for a mockup, a chart or a blank canvas, and would rather not pick one out of habit? This free random colour generator draws colours from the full 24-bit range a screen can show and puts each one on a live swatch beside its code. Choose how many you want in Count — anything from 1 to 50 — tick the formats you need, and press Generate. The page opens on a single colour in HEX, so the first result is one click away. HEX Code is ticked from the start, RGB Code and HSL Code sit beside it, and any combination of the three can be switched on at once. The gear button next to Generate opens Advanced Options, where you can limit the colours to one kind or range, rule out repeats and change how HEX is written.
Every colour is made in your browser through the Web Crypto API (crypto.getRandomValues), which supplies cryptographically strong random bytes from your system's own source of randomness, rather than by a pseudo-random function such as Math.random(). A colour on screen is three channels — red, green and blue — each a whole number from 0 to 255, and one random byte holds exactly 256 values. So each channel is simply one byte, with nothing in between: no remainder is taken, and no shade is favoured by a conversion step. That makes all 16,777,216 colours the page can produce exactly equally likely, every time you press Generate. A narrower range in Advanced Options keeps that promise inside the range: colours are still drawn from the whole space and any that fall outside are set aside, so every colour the range allows has the same chance. Your colours are never sent to our server, so we never see or log them, and once the page has loaded it keeps working with the connection switched off.
The three formats describe the same colour in three ways. HEX Code is the six-digit form used across CSS and most design tools, like #0778ff; it is written in lower case with a leading #, and Uppercase and Without # in Advanced Options change that for tools that expect otherwise. RGB Code spells out the three channels, as in rgb(7, 120, 255), which suits code that works on each channel separately. HSL Code describes the colour by hue, saturation and lightness, as in hsl(213, 100%, 51%), the easiest form to adjust by hand afterwards. All three paste straight into a stylesheet. They are not equally precise, though. HEX and RGB are exact; HSL is rounded. The page writes hue, saturation and lightness as whole numbers, and for about 89% of colours that rounded value does not convert back to exactly the same colour: #646503 is shown as hsl(61, 94%, 20%), which converts back to #616303. The difference is never more than 5 steps in a channel and usually 1 or 2 — invisible on screen, but real if you store the HSL value and expect the original HEX back. Keep HEX or RGB as the value you save.
One colour appears as a single chip in the middle of the result; several appear as a numbered list, one colour per row, with the chosen formats side by side and a small contrast badge at the end. A list of more than three colours scrolls inside the box, and the arrow in its corner opens it to full height; the page remembers which way you left it. Click any code to copy just that code. The copy button at the end of a row copies every code for that colour on one line, separated by spaces. Click the swatch itself and your browser's own colour picker opens: choose a different colour there and every code in that row is rewritten to match, in each format you have switched on, along with its badge. Copy All copies the whole batch, one colour per line, and Save to File writes the same text to a plain .txt file; both follow any colour you changed in the picker. History keeps your last 10 batches in this browser, exactly as they were generated, and Clear empties the result. Your settings, including those in Advanced Options, are remembered for the next visit.
Equally likely colours do not look evenly spread, and knowing what to expect saves pressing Generate for the wrong reason. Measured across the whole range, about 35% of colours are bright and saturated, with HSL saturation of at least 70% and lightness between 35% and 65%. Near-greys, with saturation under 20%, are only about 4%, and very dark colours (lightness under 20%) and very light ones (over 80%) are about 3% each. So a batch of ten from All colors will usually hold several strong colours and seldom a pastel or a charcoal. When you need a particular kind, choose it in Color type: Vivid keeps exactly that bright group, and Pastel, Dark, Muted and Grayscale do the same for theirs. Custom lets you set your own Hue, Saturation and Lightness ranges, and a hue range can run past 0, so 330 to 30 gives reds. The range is checked against the HSL code the page shows, so no code falls outside it, and if it holds too few colours for your Count, the page asks you to widen it rather than repeating colours. Repeats are otherwise possible but rare: tick No duplicates to rule them out, and without it the chance that two of 50 colours from the full range come out identical is about 1 in 13,700.
A random colour is often wanted as a background, which raises the one question a swatch cannot answer by eye: will text on it be readable? The web accessibility guideline, WCAG, asks for a contrast ratio of at least 4.5:1 for normal text. Measured across every colour this page can produce, black text reaches that on about 65% of them and white text on about 36%, and there is no colour on which both fail: the better of the two always reaches at least 4.58:1. So for any random background, black or white text will pass, and the page shows you which. Every colour carries a small badge that reads Aa in the better of the two, followed by its contrast ratio. The ratio is rounded down, so it never flatters a colour, and it updates when you change the colour in the picker. The badge compares only black and white text; for a brand colour or any other text colour, run the pair through a contrast checker.
Random is not the same thing as harmonious. Every colour in a batch is drawn on its own, with no knowledge of the others, so the generator never builds a palette in the designer's sense — no complementary pairs, no analogous runs, no shared lightness. A narrower range changes the character of a batch, not that rule: pastels or a run of blues still arrive one by one, with nothing tying them together. That is the point of it: it gives you the colour you would not have picked, which is what breaks a habit or a creative block. To turn a random find into something usable, keep the colour you like and build around it, rather than pressing Generate until a whole set happens to agree. Hold its hue and step the lightness for tints and shades, or turn the hue by 180 degrees for a contrasting partner. HSL Code is the format that makes those moves arithmetic rather than guesswork.
Why choose this random colour generator?
- Every colour made in your browser with the Web Crypto API, nothing uploaded
- All 16,777,216 colours exactly equally likely, one random byte per channel
- HEX, RGB and HSL codes for the same colour, in any combination
- Up to 50 colours at once, each on a live swatch with a text-contrast badge
- Vivid, Pastel, Dark, Muted and Grayscale, or your own hue, saturation and lightness range
- No duplicates when you need them, and HEX in upper case or without #
- Click a code to copy it, or change any colour in your browser's colour picker
- Copy All, Save to File and a History of your last 10 batches, kept in your browser
- Free and unlimited: no sign-up, no quota, nothing stored on our servers
Random colours earn their keep wherever a colour is needed before anyone has decided on one. Designers use them to break a creative block and to find a starting point their usual palette would never have reached. Developers fill mockups, placeholders and avatars, give each series in a chart its own colour while the real theme is still undecided, and test how an interface copes with backgrounds it was not designed for — a batch of 50 from All colors almost always includes at least one very dark or very light colour, and Dark or Pastel aims the test at one end. Generative artists and game prototypers feed the values straight into code, where the RGB form drops into most graphics libraries. Teachers put the three formats side by side to show that one colour can be written as a code, as three channels or as a position on a colour wheel, and why the HSL version is rounded. And anyone labelling, tagging or colour-coding a list gets distinct colours without agonizing over which.
A few honest limits are worth knowing. This is a generator, not a palette tool: it does not build colour harmonies and does not keep one colour fixed while the others change, and a narrower range gives colours of one kind, not colours chosen to go together. The contrast badge compares black and white text only. The page works in the sRGB colours a screen displays — HEX, RGB and HSL — with no transparency and no CMYK, Pantone, OKLCH or named CSS colours; for print, match the colour in your print workflow rather than trusting a screen code. The same code can also look slightly different from one display to another, because screens are not calibrated alike. HSL values are rounded, as described above, and unless No duplicates is ticked, a batch is not checked for repeats. What the page does guarantee is narrower and exact: every one of its 16,777,216 colours, or every colour inside the range you set, has the same chance on every press, drawn from your browser's cryptographic source and never sent to our server.