Color Palette Generator
Generate a random 5-color palette with one click. Lock any color you want to keep and regenerate the rest. Copy individual hex codes by clicking the copy icon on each swatch, or copy the full palette as a comma-separated list. Useful for design inspiration, brand color exploration, quick UI mockups, and finding harmonious color combinations to refine in a dedicated design tool.
How to Generate a Color Palette
- 1Click Generate to create a random 5-color palette
- 2Click the lock icon on any color to keep it in future generations
- 3Click Generate again to randomize the unlocked colors
- 4Copy individual hex codes or use Copy Palette for all colors at once
Key Benefits
- One-click random palette generation
- Lock individual colors to iterate on a partial palette
- Copy individual hex values or the full palette at once
- Instant visual preview with adaptive icon contrast
Frequently Asked Questions
How are the colors generated?
Each color is generated as a random 6-digit hex value using Math.random(). The result spans the full RGB color space — hue, saturation, and brightness all vary independently. This means you can get very dark, very light, or highly saturated colors in the same palette. If the result does not suit your taste, just regenerate or lock the colors you like and regenerate the rest.
Why are the palette colors sometimes hard to pair together?
Fully random generation does not apply color theory rules like complementary, analogous, or triadic relationships. The colors are independently random, so they may clash or lack contrast. To get more harmonious palettes, lock one or two colors you like and keep regenerating until the unlocked slots produce a combination that works. For precise color theory-based palettes, use a dedicated tool like Coolors or Adobe Color.
Can I use the generated colors in a web project?
Yes. Each color is a standard 6-digit lowercase hex code, directly usable in CSS, Tailwind config, design tokens, or any color field. Copy individual hex values for specific swatches, or copy the full palette as a comma-separated list to paste into a spreadsheet, token file, or design system.
What does locking a color do?
Clicking the lock icon on a color marks it as fixed — it will not change when you click Generate again. Only the unlocked colors are regenerated. This lets you build a palette iteratively: find one color you love, lock it, and keep generating until the remaining slots complement it. Click the lock icon again to unlock a color.
How do I know which colors have good contrast for text?
The lock and copy icons inside each swatch automatically switch between dark and light to remain readable against the swatch color — this is determined by the swatch's perceived luminance. However, choosing accessible text-on-background color pairs requires checking WCAG contrast ratios. Copy your chosen colors and run them through a contrast checker to verify they meet accessibility requirements.
Can I generate a palette from an existing color?
Not directly in this tool — it generates fully random palettes without an input seed color. If you want to build a palette around a specific color, lock that color in one of the five slots and let the generator fill the other four randomly until you find a combination you like. For palette generation based on color harmony rules from a specific seed, use the Color Code Converter to analyze your seed color and then explore complementary hues manually.