Color Converter
Enter a color as HEX, RGB or HSL and get the equivalent value in every other notation, with a live swatch so you can see exactly what you're converting.
Runs locally — nothing you enter is sent
Image & Design
Free · no signup
HEX: #00f0ff
RGB: rgb(0, 240, 255)
HSL: hsl(184, 100%, 50%)
How to use
- Enter a color in any supported notation (for example #4ADE80, rgb(74,222,128) or hsl(142,68%,58%)).
- Read the converted values in the other notations.
- Copy the value you need into your CSS.
Examples
HEX
#4ADE80
RGB
rgb(74, 222, 128)
HSL
hsl(142, 68%, 58%)
Supported formats
- HEX (#RGB and #RRGGBB), RGB (rgb(r, g, b)), HSL (hsl(h, s%, l%)).
Privacy
This tool runs entirely in your browser. Nothing you enter or open is sent anywhere. Privacy policy.
Limitations
- Alpha channels (RGBA/HSLA/#RRGGBBAA) and newer CSS spaces such as LCH/OKLCH are not converted.
FAQ
How do I convert HEX to RGB?
Each pair of hex digits is one channel: #4ADE80 → rgb(74, 222, 128). Paste the HEX value here to do it instantly.
When should I use HSL instead of HEX?
HSL is easier to adjust by hand — change lightness or saturation without recomputing all three channels — which makes it handy for hover states and theming.