Random Color Generator
Find a color or build a palette. Select a swatch to copy its values.
Palette settings
Your palette
Recent palettes
How to generate a random color or palette
- Set Palette size to 1 for one random color, or choose up to 8 for a palette. Select a style and harmony.
- Optionally enter a base hex color and choose a harmony to explore related hues. Click Generate palette to create colors.
- Select a swatch to inspect its hex, RGB and HSL values. Copy an individual value or use Copy palette for the whole set.
Example: explore a palette around a brand color
Enter your existing color as the base, choose Analogous for neighboring hues or Complementary for opposing hues, and generate several swatches. Select the result you want to develop and use it as the base for another exploration. Random mix draws independent hues, so choose a related-color harmony when the relationship to your base matters.
Hex, RGB and HSL describe the selected color
Hex is convenient for a CSS color such as #007F8A. RGB gives red, green and blue channel values, while HSL describes hue, saturation and lightness. Switching which value you copy does not select a new swatch. Use the generated palette as a starting point and check the actual text, backgrounds and UI states in your design before choosing a final combination.
For examples using this contrast helper, read how to build a random palette with readable text.
Random color generator questions
Can I generate just one random color?
Yes. Set Palette size to 1 and generate. The selected swatch has hex, RGB and HSL values ready to copy. Increase the palette size when you want several colors to compare.
What is the difference between style and harmony?
Style controls ranges such as saturation and lightness to create a pastel, vivid, muted, dark or light appearance. Harmony controls the relationship between hues, such as neighboring, complementary or monochrome colors.
What does Lock base color do?
It uses the active swatch as the base for later palette generation. Use active swatch also fills the base-color input from your selection. Choose a suitable harmony when you want the other colors to relate to that base.
Does Contrast helper guarantee accessible colors?
It compares black and white text against the selected swatch and reports the stronger option with a contrast ratio. It does not check all color pairs, font sizes, interactive states or the rest of your page. Treat it as a single-swatch aid rather than a full accessibility check.
Can I return to an earlier palette?
Recent palettes lets you revisit palettes generated during the current page session. Copy colors you want to keep before leaving or reloading the page. Click a palette in Recent palettes to bring its swatches back into view.