ToolBirch

Color Converter

Convert colours between HEX, RGB and HSL with a live preview.Design & Color

Colour converter

Convert between HEX, RGB and HSL. Accepts #hex, rgb(), hsl() and common CSS colour names.

Try #1a2b3c, rgb(26, 43, 60), hsl(210, 40%, 17%) or rebeccapurple.

HEX

#4F5BD5

RGB

rgb(79, 91, 213)

HSL

hsl(235, 61%, 57%)

Channels

79, 91, 213

About this tool

Design handoffs rarely stay in one colour format. Enter a HEX, RGB or HSL value, or a common CSS colour name, and see all three representations together with a swatch so you can confirm it is the colour you meant.

How to use the Color Converter tool

  1. Enter a colour. Type a HEX (#4f5bd5), RGB (rgb(79, 91, 213)) or HSL (hsl(234, 62%, 57%)) value, or a name such as rebeccapurple.
  2. Review the conversions. All formats update live. Invalid values are flagged rather than silently corrected.
  3. Copy a format. Use the Copy button next to any representation to take it into your stylesheet.

Supported formats

Input

  • HEX (#rgb or #rrggbb)
  • rgb() / rgba()
  • hsl() / hsla()
  • Common CSS colour names

Output

  • HEX
  • RGB
  • HSL
  • Live colour swatch

Inputs are validated before anything is processed. Invalid values and unsupported files are rejected with a clear error instead of failing silently.

Frequently asked questions

Are alpha values supported?

rgba() and hsla() values are accepted, but the alpha channel is ignored: all outputs describe the opaque colour, and HEX is always the six-digit form.

Are 3-digit HEX codes allowed?

Yes. #abc is expanded to #aabbcc before conversion.

Why does my HSL value look different after a round trip?

HSL and RGB are different models of the same colour; rounding to whole degrees and percentages can shift a channel by one.

Is anything sent to a server?

No. All parsing and conversion happens in the browser.

Privacy

Everything you enter stays in this browser tab. There is no upload endpoint for tool inputs, no account, and no server-side copy of your text or files. Results are produced locally and disappear when you close the page.

No account is required and no file is ever uploaded. See the privacy policy for details about analytics and the limited data this site stores.

Known limitations

  • Modern colour spaces such as OKLCH and lab() are not accepted; common CSS colour names are.
  • Alpha is ignored; HEX output is always the opaque six-digit form.
  • HSL values are rounded to whole numbers, so round trips can shift a channel slightly.

Related tools

Other free tools from the same collection.

Contrast CheckerCheck a colour pair against WCAG AA and AAA contrast thresholds.Case ConverterConvert text between upper, lower, title, camel, snake and kebab case.Percentage CalculatorWork out percentages, percentage of a value and percent changes.Image to Base64Encode any image into a ready-to-paste data URI or raw Base64 string.