Color Converter
Convert colors between HEX, RGB and HSL with a live preview swatch.
How to use the Color Converter
Convert a color between HEX, RGB and HSL with a live preview. Type in any format and all three update instantly; an 8-digit hex or an <code>rgba()</code>/<code>hsla()</code> value preserves transparency across conversions.
- 01Type a color in any supported format:
#3b82f6,rgb(59,130,246)orhsl(217,91%,60%). - 02Read the equivalent hex, rgb and hsl values in the output cards.
- 03Check the preview swatch — it shows the color over a checkerboard so transparency is visible.
tips
- —HSL is handy for design: hold the hue and nudge lightness or saturation to build tints and shades.
- —An 8-digit hex (
#rrggbbaa) carries an alpha channel; drop it for a fully opaque color. - —If the preview is blank, the input did not match a recognized format — check for typos or missing commas.
frequently asked
What is the difference between HEX, RGB and HSL?+
HEX (#ff5733) packs red, green and blue into a base-16 string. RGB lists the same three channels as decimals (255, 87, 51). HSL describes a color by hue angle, saturation and lightness — often more intuitive for designers because you can tweak lightness independently of the hue.
Does this support alpha / transparency?+
Yes. Enter an 8-digit hex (#rrggbbaa) or rgba()/hsla() and the alpha value is preserved across conversions. The preview swatch shows the color over a checkerboard so transparency is visible.
What is HSL hue?+
Hue is an angle from 0° to 360° around the color wheel: 0 is red, 120 is green, 240 is blue. Saturation and lightness are percentages that control how vivid and how bright the color is.
Is this tool free?+
Yes. Every conversion is computed in your browser — nothing is uploaded.