Color Code Converter

About the Color Code Converter

This converts a colour between the three formats web and design work uses — HEX, RGB and HSL — showing all three at once alongside a live swatch and a colour picker. Designers and developers use it to translate a brand HEX into RGB for a design tool, into HSL to tweak lightness or saturation, or to grab a value from the picker. Edit any field, or drag the picker, and the others update instantly.

How it works — the three formats

• HEX — a #RRGGBB code where each pair is a red, green or blue value in hexadecimal (00–FF). Three-digit shorthand like #f00 is also accepted.
• RGB — the same red, green and blue as decimal numbers 0–255.
• HSL — hue (0–360° around the colour wheel), saturation (0–100%) and lightness (0–100%), which is often more intuitive for adjusting a colour.

Editing one field converts through RGB to update the others: HEX and RGB are two views of the same numbers, and HSL is computed with the standard RGB↔HSL formulas.

Assumptions and behaviour

• Accepts 6-digit and 3-digit HEX, with or without the #.
• RGB and HSL fields are forgiving about format — 79, 70, 229 or rgb(79 70 229) both parse.
• The colour picker and swatch always reflect the current colour.
• HSL values are rounded to whole numbers for a clean, copyable result.

Limitations

• HSL rounding can cause tiny round-trips. Because HSL is shown as whole numbers, converting HEX → HSL → HEX can occasionally shift by one value in a channel. The HEX/RGB pair is always exact.
• It handles opaque colours; it doesn't include an alpha/transparency channel (RGBA/HSLA or 8-digit HEX).
• It doesn't convert to print colour spaces like CMYK or Pantone, which don't map exactly from screen RGB.
• It works with the sRGB colour space that browsers use.

Privacy

The conversion runs entirely in your browser. Nothing is uploaded or stored.