About the color picker
This color picker lets you choose any colour and instantly read its HEX, RGB and HSL codes, copy any of them with one click, and see a strip of lighter and darker shades to build a palette. It runs in your browser; nothing is uploaded.
How Color Picker works
HEX, RGB and HSL
HEX is the six-digit code used in HTML and CSS (like #3498DB). RGB gives the red, green and blue parts from 0–255. HSL describes the colour by hue (0–360°), saturation and lightness, which is handy for making a colour lighter or darker while keeping the same hue.
Building a palette
The shade strip takes your colour and mixes it toward white on one side and black on the other, giving you tints and shades that work together — useful for hover states, backgrounds and borders.
Common uses
- Pick a colour and get its hex code
- Convert a colour to RGB or HSL
- Copy a colour code for CSS
- Build a palette of shades
- Find lighter and darker tints
- Match a colour for a design
- Get HTML colour codes
- Explore hue and lightness
Frequently asked questions
How do I get the hex code of a colour?
Pick a colour with the swatch and the HEX value appears, ready to copy.
What is the difference between RGB and HSL?
RGB sets red/green/blue amounts; HSL uses hue, saturation and lightness, which is easier for tweaking shades.
Can I copy the colour code?
Yes — click Copy next to any of HEX, RGB or HSL.
What are the shades for?
They are lighter and darker versions of your colour for building a palette.
Is anything uploaded?
No — it runs entirely in your browser.
Is it free?
Yes, completely free.