Free Color Picker
Use HSL sliders to pick any color. Get HEX, RGB and HSL values. Click the swatch to copy HEX.
Click swatch to copy HEX
HEX
#1980e6
RGB
rgb(25, 128, 230)
HSL
hsl(210, 80%, 50%)
How It Works
Picks colors using HSL sliders — Hue, Saturation, and Lightness — with real-time HEX, RGB, and HSL output. Click the swatch to copy HEX instantly. Includes a recent colors history so you can compare and switch between picks without losing previous selections.
When to Use It
- Finding the perfect color by fine-tuning hue, saturation, and lightness independently.
- Building related color sets by adjusting only lightness for consistent variations.
- Quickly grabbing HEX codes for CSS during front-end development.
Frequently Asked Questions
Why HSL sliders instead of a color wheel?
HSL gives independent control: Hue (base color), Saturation (vibrancy), Lightness (brightness). Easy to create variations — same hue, different lightness for hover states.
What is recent colors?
The tool remembers picks during your session as clickable swatches. Compare and switch between colors without re-entering values — useful when building multi-color palettes.
How do I copy the color value?
Click the large color swatch preview to copy HEX. You can also copy RGB or HSL individually. A brief "Copied!" notification confirms the action.
All calculations happen in your browser. No data is sent to any server.
These tools are free forever. SARA takes it further.
SARA is your AI agent on WhatsApp: answers customers, takes bookings, follows up — 24/7, automatically. Try it free for 14 days.
Start your free 14-day trial →