HEX to RGB Converter

What is the HEX to RGB converter?

This is a live HEX to RGB converter that also handles HSL — all in a single, two-way view. You type a color in any one of the three formats and the other two update instantly, so you never have to switch tools or do hex math in your head. Edit the HEX field and the RGB and HSL values follow; edit RGB and the HEX value follows. On top of the raw numbers, the tool shows you the color's nearest real name (like "Dodger Blue") and a large preview swatch, so a string of digits suddenly becomes a color you can recognize.

How to use it

1. Type or paste a value into any field — a HEX code such as #1E90FF (3- or 6-digit, with or without the #), an RGB triple, or HSL.
2. Watch the other two formats update in real time, along with the big swatch preview.
3. Read the nearest color name and its family below the swatch, plus a couple of close alternatives.
4. Tap any copy button to grab the exact #hex, rgb(r, g, b), or hsl(h, s%, l%) string for your CSS or design file. Then you're done — no sign-up, nothing to install.

The method behind it

A 6-digit HEX color is three pairs of hexadecimal digits, one each for red, green, and blue. To convert HEX to RGB, split it into those three pairs and convert each from base 16 to base 10, giving a value from 0 to 255. For example, 1E is 30, 90 is 144, and FF is 255, so #1E90FF becomes rgb(30, 144, 255). Going the other way (RGB to HEX), each channel is converted back to a 2-digit hexadecimal number and joined. HSL is derived from the same RGB values: hue is the angle on the color wheel (0–360°), saturation is the color's intensity, and lightness is how light or dark it is. The color name is found by converting your color into the perceptually uniform CIELAB space and measuring the ΔE distance to a curated list of about 4,930 named colors — the closest one wins.

Examples

• #1E90FF → rgb(30, 144, 255) → hsl(210, 100%, 56%) → nearest name: Dodger Blue
• #FF6F61 → rgb(255, 111, 97) → hsl(5, 100%, 69%) → nearest name: Coral / Bittersweet
• #2E2E2E → rgb(46, 46, 46) → hsl(0, 0%, 18%) → nearest name: a near-black gray

HEX / RGB / HSL reference table

Common use cases

• Front-end developers copying a HEX from a design file into rgb() so they can add an alpha channel.
• Designers who got a HEX from a brand guide and want the HSL so they can build a lighter/darker variant.
• Anyone handed a raw hex code who just wants to know what color it actually is before using it.
• Accessibility work, as a first step before checking contrast (see our Contrast Checker).
• Spreadsheets, game configs, or APIs that expect RGB integers instead of HEX strings.

Why use this one

Most "hex to rgb" tools give you two formats and stop there. This one syncs HEX, RGB, and HSL together in a single bidirectional page — edit any format and the other two update in real time — so it doubles as an rgb-to-hex and hex-to-hsl tool without sending you to another page. It's the only one in this set that also tells you the color's nearest real name and family, runs entirely in your browser (your color never leaves the page, no account needed), and stays fast and mobile-friendly so you get the answer in a second and move on. When you want the full name match, head to the Color Namer; to lift a color straight out of a picture, try the Color Picker from Image.

Frequently asked questions