Random Color Generator
Generate random colors and palettes. View HEX, RGB, and HSL values with one-click copying.
Color History
How to Use the Random Color Generator
- Set ranges (optional) -- Adjust hue, saturation, and lightness ranges to constrain the random colors to your preferred style.
- Generate a color -- Click the button to create a random color. The large swatch updates instantly.
- View values -- HEX, RGB, and HSL values are displayed below the swatch. Click any value to copy it.
- Generate a palette -- Click "Generate Palette" to create 5 harmonious random colors at once. Click any palette swatch to select it.
- History -- Your last 10 generated colors are shown for easy reference. Click any to re-select it.
About Color Generation
Colors in digital design are expressed in several formats. HEX codes are six-character hexadecimal values prefixed with # and are the most common format in web design. RGB defines colors by their red, green, and blue channel intensity (0-255 each). HSL represents colors by hue (a degree on the color wheel), saturation (intensity), and lightness (brightness).
This tool generates colors in the HSL colour space first, then converts to HEX and RGB. This approach allows fine-grained control over the character of the generated colours -- for instance, you can ensure vibrant colours by keeping saturation high, or generate pastels by increasing lightness and reducing saturation. The colour history feature helps you compare and collect colours for your projects.
Frequently Asked Questions
Colors are generated by producing random values for hue (0-360), saturation (0-100%), and lightness (0-100%) within your chosen ranges, then converting to HEX and RGB formats for display and use in design projects.
HEX uses a six-digit hexadecimal code (#FF5733). RGB specifies red, green, and blue channels (0-255). HSL uses hue (degree), saturation (%), and lightness (%). All three formats describe the same colour differently.
Yes. Click the "Generate Palette" button to create 5 random colours displayed side by side. Click any palette swatch to select it and view its HEX, RGB, and HSL values.