Creator
Color Converter
Pick or paste a colour and convert instantly between HEX, RGB, HSL and CSS formats, with a live swatch and copy-ready values for your stylesheets.
Examples
Input
#5b6cff
Output
rgb(91, 108, 255) · hsl(234, 100%, 68%)
How it works
Pick a colour or type a hex code, with or without the #, in 3- or 6-digit form. The tool shows the same colour as HEX, rgb() and hsl(), each with its own copy button.
| HEX | RGB | HSL |
|---|---|---|
| #ffffff | rgb(255, 255, 255) | hsl(0, 0%, 100%) |
| #ff0000 | rgb(255, 0, 0) | hsl(0, 100%, 50%) |
| #808080 | rgb(128, 128, 128) | hsl(0, 0%, 50%) |
HSL values are rounded to whole numbers, so converting an HSL value back to hex elsewhere can land one step away from the original. Input is hex only: you cannot paste an rgb() or hsl() value, and transparency (alpha) is not supported.
How to use Color Converter
Choose a colour
Use the picker or paste a HEX/RGB/HSL value.
See conversions
All formats update together with a live swatch.
Copy
Copy any format for your CSS.
Why use this tool
HEX, RGB and HSL
Live colour swatch
Copy-ready CSS values
Instant
Frequently asked questions
Yes — RGBA and HSLA values include the alpha channel when present.
Found a bug or have an idea?
ToolOrbit is actively developed — feedback directly shapes what gets built next.
Send feedback