Color Converter (HEX ⇄ RGB ⇄ HSL)
Enter a color in any common format — #ff5733, rgb(255,87,51) or hsl(11,100%,60%) — and get all equivalents with a live preview and a generated shade scale.
Result
| HEX | #ff5733 | |
| RGB | rgb(255, 87, 51) | |
| HSL | hsl(11, 100%, 60%) |
Shade Scale (click to select)
HEX vs RGB vs HSL — Which Format When?
HEX (#ff5733) is the compact web standard, ideal for copy-pasting between tools. RGB expresses the same value as red/green/blue channels and is required when you need alpha transparency (rgba). HSL describes hue, saturation and lightness — by far the easiest format for humans to adjust: want it darker? Lower the L value.
All three formats describe the same sRGB color space, so conversion is lossless. Modern CSS also supports newer spaces (LCH, OKLCH) for wider gamuts, but sRGB formats remain the compatibility baseline.
Frequently Asked Questions (FAQ)
Q: How do I convert HEX to RGB by hand?
A: Split the hex code into pairs and convert each from base-16: ff→255, 57→87, 33→51 gives rgb(255, 87, 51).
Q: What is the L in HSL?
A: Lightness: 0% is black, 100% is white, and 50% is the pure hue. Adjusting only L creates consistent shade scales.
Q: Does the tool support transparency?
A: Enter rgba()/hsla() values and the alpha channel is preserved in the RGB output.
ADVERTISEMENT
Google AdSense - Responsive Content Banner (600 x 100)