Random Color Generator
Generate random colors in HEX, RGB, or HSL. Lock your favorites and regenerate the rest. Copy individual colors or all at once.
Frequently Asked Questions
How are the colors generated?
Each color is generated using the Web Crypto API (crypto.getRandomValues()) for cryptographically random R, G, B values (0–255), then converted to HEX and HSL.
What does locking a color do?
Clicking the 🔒 icon on a color card locks it in place. When you click Generate, only unlocked colors are replaced — locked ones stay the same.
How do I copy a color value?
Click on any color card (or the value text) to copy its current display format (HEX, RGB, or HSL) to your clipboard.
Can I generate colors in a specific format?
Yes — use the Display Format dropdown to switch between HEX, RGB, and HSL. The format applies to all cards and to the 'Copy all' function.
Colour Output Formats Explained
| Format | Example | Best for |
|---|---|---|
| HEX | #A3D4F7 | Copying into design tools (Figma, CSS) |
| RGB | rgb(163, 212, 247) | When you need numeric channels for math |
| HSL | hsl(205, 82%, 80%) | Creating shades: adjust L while keeping hue |
Creative Uses for Random Colors
- Mood boards — generate a set, lock the ones you like, and regenerate the rest until you have a cohesive palette.
- Placeholder UI — use a random colour per avatar or category tag to distinguish items visually without a fixed palette.
- Data visualisation — generate unique colours for chart series; check WCAG contrast against your chart background.
- Generative art — seed random colours for canvas or SVG animations for unique-every-time visual output.