Color Picker & Palette Generator
Use this online color picker to choose any color and read its HEX, RGB and HSL codes instantly, then let the palette generator suggest matching shades. It's handy for design systems, brand explorations, and copying color codes straight into your CSS.
Last updated July 19, 20263 min read
HEX
#3B82F6
RGB
rgb(59, 130, 246)
HSL
hsl(217, 91%, 60%)
How to pick a color and build a palette
- 1
Pick a color
Use the color picker or paste a HEX value.
- 2
Read the values
HEX, RGB, and HSL update live and can be copied with one click.
- 3
Generate a palette
Choose a color scheme to see matching swatches.
Benefits
- Three formats side by side: HEX, RGB, HSL.
- Five palette schemes based on color theory.
- Click any swatch to copy its HEX.
- Everything runs locally in the browser.
Common uses
- Building brand palettes
- Picking accent colors for a design system
- Extracting values from a design mockup
- Teaching color theory with real swatches
Frequently asked questions
Was this helpful?
Your feedback helps us improve our tools.