Color Palette Generator
Build a harmonious palette from a base color using real HSL math. Lock the ones you like, randomize the rest, check contrast, and export.
Last updated
About this tool
Pick a base color and a harmony rule, and this tool computes the rest of the palette with plain HSL math run in your browser — hue rotations for complementary, triadic, split-complementary and tetradic schemes, small hue offsets for analogous, and lightness steps for monochromatic. Click the lock icon on any swatch before hitting Randomize to keep that color fixed while the rest reshuffle around it.
Each swatch shows its contrast ratio against pure white and pure black text, along with a WCAG AA pass/fail badge (4.5:1 for normal text), so you can tell at a glance which colors are safe to put text on.
Export the palette as CSS custom properties, a plain HEX list, or a Tailwind config snippet — or copy the palette as a URL. The link encodes the harmony mode, every color, and which ones are locked directly in the query string, so anyone who opens it sees the exact same palette.