Free Color Converter
Convert colors between HEX, RGB, and HSL instantly, with a live picker and preview.
How to use this tool
Click the color swatch to open your browser's native color picker, or type directly into the HEX, RGB, or HSL fields. All fields update instantly and stay in sync, no matter which one you edit.
The large swatch next to the picker shows a live preview of the current color, so you can see exactly what it looks like as you adjust the values.
This is useful for converting a color from a design file into CSS code, fine-tuning a color's lightness or saturation using HSL, or quickly checking what a HEX or RGB value looks like.
FAQ
- What color formats does this tool support?
- HEX (like #3B82F6), RGB (red, green, blue values from 0-255), and HSL (hue, saturation, lightness).
- How do I convert a color?
- Edit any field, HEX, RGB, or HSL, or use the color picker swatch, and every other field updates instantly to match the same color.
- Can I pick a color visually instead of typing values?
- Yes. Click the color swatch on the left to open your browser's native color picker and choose a color visually.
- Is this useful for web or app design?
- Yes. It's commonly used to convert a color copied from a design tool into the CSS format you need, or to explore a color's HSL values to adjust lightness or saturation.