Color Picker (HEX, RGB, HSL)

Pick a color and instantly get its HEX, RGB, and HSL values. Convert between formats and copy with one click. Free and client-side.

Last updated 23 June 2026 · Built and maintained by Mustafa Bilgic

Free Online Color Picker and Converter

Pick any color with the native color picker, or type a HEX, RGB, or HSL value, and this tool converts it into all three formats at once. Click any code to copy it. It is perfect for web design, CSS, branding, and matching colors across tools.

How to Use the Color Picker

  1. Click the color swatch to open your system color picker, or type a value into any of the HEX, RGB, or HSL fields.
  2. The other formats and the large preview update automatically.
  3. Click any code in the lower grid to copy it to your clipboard.

Understanding Color Formats

FormatExampleBest for
HEX#8B5CF6CSS, design tools, web
RGBrgb(139, 92, 246)CSS, screen rendering, JavaScript
HSLhsl(258, 90%, 66%)Adjusting hue, lightness, and shades

Frequently Asked Questions

How do I convert HEX to RGB?

Type the HEX code into the HEX field and the RGB and HSL fields update instantly. Each pair of hex digits maps to a red, green, or blue value from 0 to 255.

What is HSL and why use it?

HSL stands for Hue, Saturation, and Lightness. It is intuitive for tweaking a color: change lightness for tints and shades, or rotate the hue for a related color.

Can I type any of the three formats?

Yes. Enter a value into HEX, RGB, or HSL and the others recalculate. The large swatch always shows the current color.

Does it support short HEX codes like #f00?

Yes. Three-digit shorthand HEX codes are expanded automatically, so #f00 becomes #ff0000 (pure red).

Is the color picker free and private?

Yes. It is completely free and runs entirely in your browser. No colors or data are sent to any server.

More Free Tools