Color Picker & Palette
Pick a color and convert it between HEX, RGB, and HSL — then generate complementary, triadic, or analogous palettes.
Palettes
Complementary
#3c83f6
Base
#f6af3c
Complement
Triadic
#3c83f6
Base
#f63c83
Triad 1
#83f63c
Triad 2
Analogous
#3ce0f6
Analogous 1
#3c83f6
Base
#523cf6
Analogous 2
Free · No sign-up · Runs in your browser
How to use
- Use the color picker or type a HEX, RGB, or HSL value.
- All formats update in sync as you change any one of them.
- Choose a palette type — complementary, triadic, or analogous — to generate related colors.
- Click any color swatch to copy its HEX value, or copy the full CSS snippet.
Questions
What formats are supported?
HEX (#rrggbb), RGB (0–255 per channel), and HSL (hue 0–360, saturation and lightness 0–100%). All three update in sync.
What is a complementary color?
The color exactly opposite on the color wheel — 180° away in hue. It provides maximum contrast and is useful for call-to-action highlights.
Does it support alpha / transparency?
Not currently. The tool works with fully opaque colors.
Advertisement