Skip to content
snip tools

Color picker

Pick a color and get HEX, RGB and HSL values instantly — convert and copy, in your browser.

Runs 100% in your browser

How to use the color picker

  1. Choose a color. Use the picker or type a hex code.
  2. Read the values. HEX, RGB and HSL update instantly.
  3. Copy what you need. Click Copy beside any format.

About color formats

The same color can be written several ways. HEX (#2563EB) is compact and ubiquitous in CSS; RGB exposes the red/green/blue channels directly; and HSL (hue, saturation, lightness) is the most intuitive for tweaking — nudge lightness for tints and shades, or rotate hue for related colors. This picker keeps all three in sync. To check a pairing is readable, run it through the contrast checker.

Frequently asked questions

What formats does it show?
For any chosen color it gives the HEX, RGB, HSL and CSS rgb()/hsl() values, plus the individual channel numbers — everything you need to drop into CSS or a design tool.
Can I enter a specific hex code?
Yes. Type a hex value (with or without the #) and the picker, sliders and other formats update to match.
Does it work offline / privately?
Yes. The picker runs entirely in your browser using the native color input and a little math — no data is sent anywhere.
How do I get a whole palette?
Use the color palette generator to build complementary, analogous and shade sets from a base color.