Color Converter (HEX ⇄ RGB ⇄ HSL)

Convert colors between HEX, RGB, and HSL with a live swatch.

Quick answer: Convert CSS colors between HEX, RGB, and HSL instantly. Free online color converter for web developers and designers with live preview swatches.

HEX color

Or pick

#0B5FFF

RGBrgb(11, 95, 255)

HSLhsl(219, 100%, 52%)

Paste a color in HEX, RGB, or HSL and get all three formats with a live preview swatch — the everyday conversion in CSS and design work.

How it works

Paste a color value into the search box in any format (e.g., #FFFFFF or rgb(255, 255, 255)).
The engine parses the format and visually displays a color swatch.
Copy the exact matching HEX, RGB, or HSL strings for your CSS.

Frequently asked questions

When is it best to use the HSL format?

HSL is perfect for designing systemic themes. You can easily vary the Lightness channel for hover states while keeping the Hue intact, which is mathematically awkward with HEX.

Does a 3-digit HEX like #FFF equal #FFFFFF?

Yes. In CSS, a 3-digit HEX simply doubles each character to form the 6-digit equivalent. This tool accepts both.

What about alpha channel transparency?

This tool converts opaque colors. For alpha transparency, append the decimal after converting: rgba(..., 0.5) or use an 8-digit HEX code.

More in Developer Tools

Password Generator

Strong random passwords from a cryptographic source — never sent anywhere.

Unix Timestamp Converter

Epoch seconds/milliseconds to human dates and back — with live now.

Regex Tester

Test regular expressions live with match highlighting and flags.

JWT Decoder

Decode and inspect JWT header, payload, and expiry — locally.

CSV to JSON Converter

Convert CSV to JSON and JSON to CSV, both directions.

CSS Gradient Generator

Design a linear gradient and copy the CSS.