My Tools Garage

HEX / RGB / HSL Converter

Convert colours between HEX, RGB and HSL.

in-browser
HEX #22d3ee
RGB rgb(34 211 238)
HSL hsl(188 86% 53%)

How to use

  1. 1 Enter a colour in HEX, RGB or HSL.
  2. 2 See the other two formats and a live swatch.
  3. 3 Adjust channels to fine-tune the colour.
  4. 4 Copy the format you need.

About HEX / RGB / HSL Converter

The HEX / RGB / HSL Converter translates a colour between the three formats CSS understands: hexadecimal (#22D3EE), RGB (rgb(34 211 238)) and HSL (hsl(187 84% 53%)).

It accepts 3-, 4-, 6- and 8-digit hex (the 4- and 8-digit forms include an alpha channel), expands shorthand automatically, and shows a live swatch so you can confirm the colour by eye.

Designers and developers move between these formats constantly — HEX in a style guide, RGB for opacity math, HSL when you want to nudge lightness or hue.

Doing the conversion by hand is error-prone; this tool round-trips them accurately.

It runs locally in your browser.

FAQ

Does it support transparency?

Yes — 4- and 8-digit hex carry an alpha channel, and it is preserved across RGB and HSL.

Can I paste shorthand like #0f0?

Yes, 3- and 4-digit shorthand is expanded automatically.