Color Palette Generator
Generate beautiful color palettes from a base color. Shades, tints, complementary colors.
Shades & Tints (Tailwind-style)
Complementary
Analogous
Triadic
About Color Palette Generator
Generate a complete color palette from any base color. Produces a 10-step scale (50–900) of tints and shades similar to Tailwind CSS, plus complementary, analogous, triadic, and split-complementary color schemes based on color theory. Export the full palette as CSS custom properties, a Tailwind CSS theme config, or a list of hex codes. Perfect for building design systems and UI component libraries.
All processing happens entirely in your browser using modern web APIs. Nothing is uploaded to our servers — your data stays local and private. Free to use forever, with a Pro plan for power users who want an ad-free experience and API access.
Common use cases
- Generating a Tailwind-compatible 10-shade color scale from a brand color
- Creating a complete CSS design token palette for a design system
- Exploring complementary and analogous colors for a UI color scheme
- Finding accessible light/dark variations of a brand color
- Building a consistent color scale for data visualization charts
How it works
Converts the base color to HSL. For the shade scale: lightness is interpolated from 95% (shade 50) to 10% (shade 900) while preserving hue and adjusting saturation slightly. For complementary colors: hue is rotated 180°. For analogous: ±30°. For triadic: ±120°. All resulting colors are converted back to HEX for output.