Skip to content
TextArray1.53.0
100% local

Color palette generator

Turn one base color into a full palette using color-wheel harmony rules.

Input
0
0
Output
Related tools
Color converterDeveloper tools
CSS color variable extractornewDeveloper tools
Random color generatorRandom generators
LRC lyrics generatorRandom generators
Test IBAN generatorRandom generators
Random name generatorRandom generators
Color palette generator
Paste a base color as a hex code, rgb() or hsl() value and this tool builds a full palette around it using color-wheel harmony rules, not a simple lightness ramp of the same hue. Pick complementary for a single opposite color, split-complementary or triadic for balanced contrast, tetradic for a four-color rectangle, analogous for neighboring hues that sit naturally together, or monochromatic for tones and shades of one hue.
The harmony option decides how many colors come out — complementary always returns two, triadic and split-complementary return three, tetradic returns four — while the color count and hue-step angle only apply to analogous and monochromatic, where you choose how many colors and how far apart. Calculate in HSL for classic color-wheel math, or switch to OKLCH, which holds the same perceived lightness across every hue so a palette doesn't come out with one swatch looking oddly dark or washed out next to the rest. Saturation and lightness adjustment sliders fine-tune the whole palette after the harmony is built, and the color format option prints each result as hex, rgb(), hsl() or oklch().
Every swatch is checked against WCAG AA (4.5:1) as text on white and on black, marked with a check or cross next to each ratio — useful for picking which colors in a generated palette are safe for body text versus decoration only. Export the result as a plain list, a block of CSS custom properties ready to paste into a stylesheet, or a Tailwind config color object.
Everything runs locally in your browser — the color you enter is never uploaded anywhere. Copy the output, download it as a .txt file, or send it to another tool's input to keep working with it.
FAQ
What input formats does it accept for the base color?
Hex codes (#3b82f6, #38f, with or without the #), rgb()/rgba() and hsl()/hsla(). Paste one of those and the palette updates instantly.
What's the difference between HSL and OKLCH for the calculation?
HSL is the classic color-wheel math and is fast and predictable. OKLCH is a perceptually uniform space, so a palette built in it keeps a more even perceived lightness across hues instead of some colors looking darker or lighter than others by accident.
Why does changing "colors in palette" only affect some harmonies?
Complementary, split-complementary, triadic and tetradic are fixed by definition — two, three, three and four colors. The count only controls analogous and monochromatic, which can reasonably have any number of colors.
What does the AA check/cross next to each color mean?
It's the WCAG contrast ratio of that color used as text on a white background and on a black background, with a check when it clears the 4.5:1 AA threshold and a cross when it doesn't.
Is my color uploaded anywhere?
No. The palette is generated entirely in your browser — nothing you type is sent to a server.