Convert colors between HEX, RGB, and HSL formats in real time. Edit any field and the others update automatically.

How to use

  1. Type a color code in any field (HEX, RGB, or HSL).
  2. The other two formats are updated automatically.
  3. The color preview reflects the current value.
  4. Copy the format you need from the displayed strings below.

Format guide

  • HEX — 6 hex digits like #ec4899, the standard in CSS and design tools
  • RGB — three values 0–255 (Red, Green, Blue), used in CSS rgb() and most graphics software
  • HSL — Hue (0–360°), Saturation (0–100%), Lightness (0–100%) — easier to reason about than RGB

Use cases

  • Converting design specs from one format to another
  • Translating brand colors between tools
  • Generating tints and shades by adjusting HSL Lightness
  • Building color systems with consistent Hue

FAQ

Are conversions accurate?

Yes — uses standard sRGB color space formulas. Round-trip conversions (HEX → HSL → HEX) may have ±1 unit rounding error in RGB channels, which is imperceptible.

What about alpha (transparency)?

This tool handles opaque colors only. For alpha, use 8-digit HEX (#ec4899ff) or rgba() manually.

Is HSL better than RGB?

HSL is easier for humans — adjusting Hue rotates color, Saturation controls vividness, Lightness controls brightness. RGB requires changing three channels together to do the same.

Does it support short HEX (#abc)?

Yes — 3-digit HEX is automatically expanded to 6-digit (e.g., #abc → #aabbcc).