Color Converter (HEX, RGB, HSL)
Convert a color between HEX, RGB and HSL, with a live swatch.
Color converter
Type a color in any of the three formats.
Examples: #1e90ff, #f0f, rgb(30, 144, 255), hsl(210, 100%, 56%)
Result
Preview
HEX
#1e90ff
RGB
rgb(30, 144, 255)
HSL
hsl(210, 100%, 56%)
Private: Everything runs in this page. Nothing you type is sent anywhere or saved.
On this page
Color examples
| Color | HEX | RGB | HSL |
|---|---|---|---|
| red | #ff0000 | rgb(255, 0, 0) | hsl(0, 100%, 50%) |
| spring green | #00ff7f | rgb(0, 255, 127) | hsl(150, 100%, 50%) |
| gray | #808080 | rgb(128, 128, 128) | hsl(0, 0%, 50%) |
| dodger blue | #1e90ff | rgb(30, 144, 255) | hsl(210, 100%, 56%) |
| black | #000000 | rgb(0, 0, 0) | hsl(0, 0%, 0%) |
| white | #ffffff | rgb(255, 255, 255) | hsl(0, 0%, 100%) |
Formula
RGB channels are 0 to 255; HSL is hue in degrees, saturation and lightness in percent
How the color converter works
- Step oneType a color as HEX (#1e90ff or #f0f), RGB or HSL.
- Step twoThe other two formats and the swatch update at once.
- Step threeCopy the format you need.
What this tool does not do
- It converts between the sRGB forms HEX, RGB and HSL only; there is no CMYK or color profile handling.
- Rounding can move a value by 1 when you convert back and forth.
- It does not give names to colors.
Frequently asked questions
Why are HSL values rounded?
HSL is shown in whole degrees and whole percents, so converting back can differ from the original by one step in the last digit.
What is the short HEX form?
#f0f means #ff00ff: each digit is doubled.
Does it support color names?
No. Use HEX, RGB or HSL.