Color Converter

Color Converter

The Color Picker & Converter lets you pick a color visually and translate it between the formats front-end developers use every day — HEX, RGB and HSL — with a live preview. Click the swatch to open the picker, or, on supported browsers, use the screen eyedropper to grab any color from your display. HEX is compact, RGB maps to channels, and HSL makes lightness and saturation tweaks intuitive.

Why use Color Converter

  • Visual color picker — click the swatch to choose a color.
  • Screen eyedropper to sample any pixel (where supported).
  • Convert between HEX, RGB and HSL instantly with a live preview.
  • Paste any supported format and read the rest — all computed locally.

How to use Color Converter

  1. 1Pick or type a color. Click the swatch to open the color picker, use the eyedropper, or type a HEX, RGB or HSL value.
  2. 2Read every format. The other formats update instantly alongside the preview.
  3. 3Copy. Copy the format you need into your stylesheet.

Frequently asked questions

Is there a color picker?
Yes — click the swatch to open a visual color picker, and on supported browsers use the eyedropper to grab any color from your screen.
Which formats are supported?
HEX (#rrggbb), RGB (rgb(r,g,b)) and HSL (hsl(h,s%,l%)). Pick or paste any of them and the others update instantly.
Does it support alpha?
This converter focuses on opaque colors; for alpha you can append it to the HEX (#rrggbbaa) in most browsers.

Developer notes

HSL is great for generating shades: keep hue and saturation, adjust lightness. Remember CSS hex is #RRGGBB (or #RGB shorthand), and HSL hue is in degrees (0–360).

Related tools

Number Base Converter
Convert integers between binary, octal, decimal & hex.
Epoch Converter
Convert Unix timestamps, ISO 8601, JWTs & more — instantly.
JSON Formatter
Pretty-print, minify, validate & explore JSON.
Regex Tester
Test patterns live with match highlighting & groups.
Base64 Encoder
Encode and decode Base64 text and files, UTF-8 safe.
Copied