Color & Design

Color Converter

Convert a color between HEX, RGB and HSL. Type any format or use the picker, then copy the value you need.

Color & design

Color converter

Live preview
#2563EB
#2563EBHEX
rgb(37, 99, 235)RGB
hsl(221, 83%, 53%)HSL
--color: #2563EB;CSS variables
Channel values for the current color
RedGreenBlueHueSaturationLightness
3799235221°83%53%
Converted in your browser

No color values are sent anywhere — the conversion maths runs on your device.

HEX, RGB and HSL explained

HEX is a six-digit hexadecimal shorthand for the red, green and blue channels: #2563EB means red 37, green 99, blue 235. RGB states those same channels as decimal numbers from 0 to 255.

Why HSL is useful

HSL describes a color as hue (0–360° around the color wheel), saturation and lightness. It makes tweaking a palette intuitive: keep the hue, raise the lightness, and you get a lighter tint of exactly the same color.

Shorthand HEX

Three-digit HEX values such as #0AF expand to #00AAFF, so both forms are accepted here.

Good to know

Frequently asked questions

Which formats can I paste?

HEX (three or six digits, with or without #), rgb() or rgba(), and hsl() or hsla(). The other formats update instantly.

Does it support transparency?

Alpha values are accepted in the input but ignored in the conversion, which always describes the solid color.

Why does HSL show rounded numbers?

Hue, saturation and lightness are rounded to whole numbers, which matches how CSS values are normally written. Converting back gives the same visible color.

Can I use the system color picker?

Yes. The picker sets the value directly, and all formats update at the same time.