Skip to content

Color Converter

Convert between hex, RGB, and HSL — paste any format, see all three with a live swatch.

 

What this tool does

Convert between hex, RGB, and HSL color formats — the three CSS formats designers and developers swap between most often. Paste any format, see all three plus a live preview swatch.

How to use it

Paste any of:

#ff8000
#f80
rgb(255, 128, 0)
rgba(255 128 0 / 0.5)
hsl(30, 100%, 50%)
255, 128, 0

Outputs in every other format simultaneously, with a swatch so you can confirm the parse visually.

Limits and edge cases

  • Alpha is parsed but dropped on output (the converter focuses on opaque colors). Use rgba()/hsla() in your CSS directly when you need alpha.
  • HSL ↔ RGB is a polar-to-cartesian conversion with rounding, so a round-trip may shift by ±1 component value. Hex ↔ RGB is lossless.
  • For wide-gamut work (display-p3, oklch), this tool is not the right one — it operates entirely in sRGB.

Frequently asked questions

Is anything sent to a server?
No. Parsing and conversion are pure math in your browser.
Why does my HSL round-trip differ by 1?
HSL is a polar coordinate over RGB cube vertices; round-tripping involves trig and rounding. Differences are always within ±1 on each channel and visually imperceptible.
Does it support hex with alpha (#rrggbbaa)?
Yes — alpha is parsed but dropped on output. The RGB and HSL formats also accept alpha forms; alpha is ignored.
What about named colors like 'tomato' or 'rebeccapurple'?
Not yet — type in a hex/RGB/HSL form instead. The CSS named-color table is large; we'll add it if there's demand.