Color Picker

Pick a colour and copy it in every format.

About Color Picker

A colour picker that converts between HEX, RGB, HSL, HSV and CMYK. Pick with the swatch or type a hex, rgb() or hsl() value and copy each format.

How to use

  1. Click the swatch to open your browser's native colour picker, or type a colour such as #2563EB, #25E, rgb(37, 99, 235) or hsl(221, 83%, 53%).
  2. The HEX, RGB, HSL, HSV and CMYK values update as you type, each with a Copy button; Copy on the panel copies all five lines.
  3. The large swatch beneath the input shows the colour at full size.

What it supports

  • Input: #RGB, #RRGGBB, #RRGGBBAA, rgb(), rgba(), hsl() or hsla(). Alpha is accepted but dropped from the output.
  • Output: HEX in upper case, rgb(r, g, b) with values 0 to 255, hsl(h, s%, l%) and hsv(h, s%, v%) with hue in degrees and percentages rounded to whole numbers, and cmyk(c%, m%, y%, k%).
  • Default colour: #2563EB.

The tool does not pick colours from an uploaded image, build palettes or check contrast ratios.

Example

#2563EB
→ rgb(37, 99, 235)
→ hsl(221, 83%, 53%)
→ hsv(221, 84%, 92%)
→ cmyk(84%, 58%, 0%, 8%)

Privacy

Conversion runs in the browser. No request is made, and nothing is stored.

Frequently asked questions

How do I convert a hex colour to RGB?
Split the six hex digits into three pairs and convert each pair from base 16 to decimal. #2563EB gives 25 → 37, 63 → 99 and EB → 235, so the colour is rgb(37, 99, 235).
What is the difference between RGB and HSL?
RGB describes a colour by the amount of red, green and blue light (0 to 255 each). HSL describes the same colour by hue (0 to 360 degrees on the colour wheel), saturation and lightness (0 to 100%), which makes it easier to lighten, darken or shift a colour by changing one number.
Why does hsl() sometimes not round-trip exactly to the same hex?
Hue, saturation and lightness are rounded to whole numbers for display, and a whole-number HSL value can map to a neighbouring RGB value. The difference is at most one or two units per channel and is not visible.