Color Palette Generator
Generate tints, shades, and harmonious color palettes from any base color.
Tints (lighter)
Base Color
Shades (darker)
Color Harmonies
Complementary
Split-Complementary
Triadic
Color Palette Generator creates 10 tints (mixed toward white) and 10 shades (mixed toward black) from any base color, plus complementary, split-complementary, and triadic harmonies. Click any swatch to copy its hex value.
Frequently Asked Questions
What is the difference between tints and shades? +
A tint is a color mixed with white (higher lightness), and a shade is a color mixed with black (lower lightness). Both are generated by linearly interpolating the RGB values toward #ffffff or #000000.
How are harmonies calculated? +
Harmonies rotate the hue angle in HSL space: Complementary is +180°, Split-Complementary is ±150°, and Triadic is ±120°. Saturation and lightness stay the same.
How do I copy a color? +
Click any color swatch and its hex value is copied to your clipboard. A confirmation message appears at the top.
How to Use
- 1
Choose a base color
Enter a HEX color or use the color picker to select your primary brand color or starting hue.
- 2
Select harmony type
Choose complementary, analogous, triadic, or monochromatic to generate a harmonious palette.
- 3
Copy the palette
Click any swatch to copy its HEX value and use the colors in your CSS, Figma, or design system.
Frequently Asked Questions
- Complementary (180° opposite), analogous (±30° adjacent), triadic (120° apart), and monochromatic (same hue, different lightness).