Generate random color palettes with HEX, RGB, and HSL values
Click any color to copy • No signup needed
Generate 5-color palettes instantly, either fully random or based on a colour-wheel rule (analogous, complementary, triadic or monochrome). Each color displays its HEX, RGB, and HSL values — the three standard formats used in web design, graphic design, and digital art.
Click any color swatch to copy its HEX code to your clipboard. Use the "Copy All" button to grab the entire palette at once. All generation happens in your browser; no data is sent to any server.
Need a color scheme for a new website? Generate palettes until you find one that matches your brand mood. Copy HEX values directly into your CSS.
Working on a poster, logo, or social media graphic? Use the palette as a starting point, then adjust saturation or lightness in your design software.
Mobile apps need consistent color systems. Generate a palette and assign colors to primary actions, backgrounds, text, and accents.
Starting a new project? Generate 10–20 palettes and narrow down to 2–3 options. Test them on mockups before finalizing.
Consistent slide decks use 3–5 colors maximum. Generate a palette and apply it across title slides, charts, and callout boxes.
T-shirts, mugs, and stickers need bold, limited palettes. Random generation can spark combinations you might not choose manually.
HEX is the most compact format — six characters that work in every browser. RGB is intuitive if you think in light levels (0 = off, 255 = full brightness). HSL is best for adjustments because changing the "L" (lightness) value creates tints and shades of the same hue.
For text on backgrounds, aim for a contrast ratio of at least 4.5:1 (WCAG AA standard). Dark text on light backgrounds (or vice versa) is safer than mid-tone combinations. Tools like WebAIM's contrast checker can verify specific pairs.
All examples start from one base blue, #267FD9 (HSL 210°, 70%, 50%). Changing only the hue or lightness gives each scheme:
| Scheme | Rule | Example colors |
|---|---|---|
| Monochromatic | One hue, different lightness | #0F3357, #1B5998, #267FD9, #67A6E4, #A8CCF0 |
| Complementary | Opposite hue (+180°) | #267FD9 with #D98026 |
| Analogous | Neighbouring hues (±30°) | #26D9D9, #267FD9, #2626D9 |
| Triadic | Three hues 120° apart | #267FD9, #D92680, #80D926 |
For a deeper walkthrough with contrast ratios, read our monochromatic and complementary colors guide.
Monochromatic colors are the safest choice: they always match because they share a hue, so they suit clean UI and minimal design. Complementary colors sit opposite each other on the color wheel and give maximum contrast, best used with one dominant color and the other as an accent. Analogous colors feel calm and natural, and triadic colors are lively and work best when one color leads.
Tips for combining colors: use a 60-30-10 split (dominant, secondary, accent), keep text contrast at 4.5:1 or higher, and use HSL lightness changes to create tints and shades of the same hue.
The tool displays colors in HEX (e.g., #FF5733), RGB (e.g., rgb(255,87,51)), and HSL (e.g., hsl(9,100%,60%)) formats. Click any color box to copy its HEX value to your clipboard.
Each palette contains 5 colors. Click Generate Palette to create a new random set. There is no limit to how many palettes you can generate.
Yes. All generated colors are random and free to use for any personal or commercial project without attribution.
Copy the HEX value and paste it directly into the color picker of any design software. In CSS, use the HEX value for backgrounds, text, borders, or any color property.
Yes, when you pick a scheme. Choose analogous, complementary, triadic or monochromatic and the tool builds the palette from a base hue using the color-wheel rule. Choose the random option if you want unexpected combinations for inspiration.