Generators
Random Color Generator
Generate a random colour with its HEX code and a live preview, useful for design ideas and placeholder colours.
About the Random Color Generator
The Random Color Generator gives you a random colour with a big preview, its HEX, RGB and HSL codes, and a check of whether white or black text is readable on it. Choose a style: Vivid, Pastel, Muted or Dark, and your recent colours are kept as swatches you can tap to go back to.
What you can do with the Random Color Generator
- Big preview: With HEX, RGB and HSL codes.
- Four styles: Vivid, Pastel, Muted or Dark.
- Readable text check: Shows if white or black text works on it.
- Recent swatches: Tap one to go back to it.
What a HEX code means
A HEX colour like #3FAE8C is three pairs of hexadecimal digits for red, green and blue, each from 00 to FF (0 to 255). That gives 256 × 256 × 256 = 16,777,216 possible colours.
Pick a mood
Fully random colours are often murky. The style buttons keep the randomness but limit it: Pastel gives light, soft colours; Vivid gives bright, saturated ones; Muted gives greyish, calm tones; Dark gives deep shades for backgrounds.
Checking readability
If you'll use the colour behind text or on a button, the contrast check tells you straight away whether white or black text passes the accessibility guideline of 4.5:1 for normal text, or 3:1 for large text.
Related tools
Frequently Asked Questions
How many colours can a HEX code show?
16,777,216, every combination of 256 levels of red, green and blue.
How do I copy the code?
Tap the big swatch to copy the HEX code, or tap the HEX, RGB or HSL row to copy that format.
Can I use the colour in CSS?
Yes, all three formats work directly in CSS, for example color: #3fae8c;
How do I convert a HEX code to RGB?
Split the six digits into three pairs and convert each from base 16 to a number from 0 to 255. #20B3DF becomes 20, B3 and DF, which is rgb(32, 179, 223). The tool shows the RGB and HSL codes for every colour, so you don't need to convert by hand.
What do the numbers in HSL mean?
HSL stands for hue, saturation and lightness. Hue is the position on the colour wheel from 0 to 360 degrees, saturation is how intense the colour is, and lightness runs from black at 0% to white at 100%. #20B3DF is about hsl(194, 75%, 50%).
What contrast ratio do I need for readable text?
WCAG AA asks for at least 4.5:1 for normal text and 3:1 for large text; AAA asks for 7:1. The tool checks white and black text on each colour and marks it AA, Large text only, or Too low. Black on #20B3DF scores 7.71:1, white only 2.45:1.
What is the difference between Vivid, Pastel, Muted and Dark?
Each style limits the saturation and lightness picked. Vivid gives strong, bright colours, Pastel gives soft and light ones, Muted gives greyer, toned-down shades and Dark gives deep colours. Any picks from the full range, so you can get all kinds.
How do I go back to a colour I liked?
Tap its swatch under Recent colours to bring it back with all its codes. The tool keeps your last 14 colours while the page is open, but they are not saved, so copy any code you want to keep before you leave or reload.
Will the colour look the same on every screen?
Not exactly. The HEX code is the same everywhere, but phones, laptops and monitors show colours differently depending on the panel, brightness and settings, and printing changes it more. For print, ask your printer for a proof.
How can I use this for a brand or design palette?
Generate colours in one style, such as Pastel or Muted, so they share a similar feel, and keep the ones you like from Recent colours. Check the text contrast for each before using it behind words on a website, poster or social media post.
Why does it suggest black text on some bright colours?
Contrast depends on how light a colour looks to the eye, not on how bold it seems. Bright yellows, cyans and greens are light, so black text often has much higher contrast on them than white. Follow the AA result rather than guessing.
Related tools
- Random Number Generator, Generate one or many random whole numbers in any range, with optional no-repeat and sorting, for draws, games and sampling.
- Dice Roller, Roll up to 50 virtual dice: d4, d6, d8, d10, d12, d20 or d100, and see each roll and the total.
- Coin Flip & Yes/No Decider, Flip a fair virtual coin or get a random Yes / No answer, with a running tally of every result.
- Random Name Picker, Pick one or several random winners from a list of names or entries, fair, quick and ideal for giveaways, raffles and classrooms.
- Color Palette Generator, Create a five-colour palette from one starting colour, with evenly spaced hues for balanced, cohesive colour schemes.
- Color Format Converter, Convert colours between HEX, RGB and HSL formats in either direction, with a live colour preview.
Quick Work Studio