Color Converter
Color
About
HEX, RGB and HSL are three ways to write the same color. HEX packs the red, green and blue channels into two hex digits each (#3B82F6), RGB lists them as numbers from 0 to 255, and HSL describes the color as hue, saturation and lightness, which makes lighter, darker or more muted variants easier to reason about.
How to use
1.
Type a color into the HEX, RGB or HSL field, or click Pick a color to choose one with the color picker
2.
The other two fields update as you type - click the copy icon in the field you need
Common uses
▸
Converting HEX colors from a design file to CSS rgb() or hsl()
▸
Adjusting HSL lightness or saturation to find lighter, darker or more muted variants
▸
Seeing what color an rgb() or hsl() value in a stylesheet actually is
Similar tools
Frequently asked questions
What color formats does this support?
HEX (#ff6600, or the shorthand #f60, with or without the #), RGB (rgb(255, 102, 0)) and HSL (hsl(24, 100%, 50%)). RGB and HSL also accept the modern space syntax (rgb(255 102 0), hsl(24deg 100% 50%)) and decimal values, and RGB channels can be percentages. Decimal or percentage RGB values are rounded to the nearest whole channel value for HEX and HSL.
Why does the HSL output have decimals?
HSL is shown with up to one decimal place because whole numbers are not precise enough for every HEX color - #1976D2 is hsl(209.8, 78.7%, 46.1%), and rounding that to hsl(210, 79%, 46%) would convert back to #1975D2. One decimal converts back to exactly the color you entered.
Can I enter a color name like "red"?
No - only HEX, RGB and HSL values are accepted, so a name such as red shows an error. Enter its HEX value instead (red is #FF0000).
Does it support alpha/transparency?
No - the tool works with fully opaque colors. rgba()/hsla() values and the "/ alpha" form are accepted only when the alpha is 1 (or 100%), and 8-digit hex such as #FF660080 is not accepted. Any other alpha shows an error rather than being silently dropped, since the result would be a different color.
Is my data sent to a server?
No. All conversion runs in your browser, and no color values are sent anywhere.