Color Picker

Pick colors and convert HEX, RGB and HSL instantly. Every pick is converted in real time with one-click copy — all done locally in your browser.

Click the swatch to open the system color dialog and drag the cursor to pick.

HEX
#4F46E5
RGB
rgb(79, 70, 229)
HSL
hsl(243, 75%, 59%)

How to use

  1. Click the swatch next to "Pick a color" to open the system color dialog, or click any color in the suggested palette below.
  2. Every pick updates the preview area and the HEX, RGB and HSL values in real time.
  3. Click the "Copy" button next to a format to copy that color value to your clipboard.
  4. Looking for inspiration? Hit "Random color" and let chance decide.

FAQ

What is the difference between HEX, RGB and HSL — which should I use?
They describe the same color in different ways. HEX is the most common in CSS; rgb() is handy when you work with alpha or code; hsl() splits hue, saturation and lightness, which makes manual tweaking more intuitive. This tool keeps all three in sync.
How accurate are the conversions?
Conversions use the standard sRGB algorithm locally. HEX to RGB is an exact integer conversion; HSL is displayed as rounded degrees and percentages, so converting back may differ by one unit at most — that is normal rounding.
Can I pick a color from anywhere on my screen?
No. This is a web color component, so it only picks from the system color dialog. To sample colors from other apps on your screen, use your OS screenshot color tool or a dedicated picker app.
Will colors change in dark mode?
No. Color values are absolute — the page theme only affects the interface appearance, never the picked or converted colors.

Related Tools