Color Converter (HEX, RGB, HSL)
Convert any CSS color between HEX, RGB, and HSL with a live preview.
100% in your browser — nothing uploadedConvert HEX to RGB and HSL
About this color converter
Type or paste a color in any common CSS format — 3-, 4-, 6-, or 8-digit hex, rgb() / rgba(), hsl() / hsla(), or a named color like tomato — and every equivalent appears instantly: HEX, RGB, and HSL, plus rgba(), hsla(), and 8-digit hex whenever the color has transparency. A large preview swatch and a native color picker stay in sync with whatever you enter, so you can also start from the picker and copy the code you need.
It’s built for the everyday reality of front-end work: a designer hands you an rgba() value, your stylesheet uses hex, and your design tokens want HSL so you can tweak lightness without shifting the hue. The conversion math runs locally in your browser with exact RGB-to-HSL formulas in both directions — no server round trip, nothing logged, no account. Once the page loads, it even works offline.
Why there's no CMYK or Pantone here
CMYK isn't a formula you can compute from a screen color. A CMYK number only means something paired with an ICC profile — a lookup table measured from one specific printer, ink and paper. MDN says as much about CSS's own device-cmyk(): it is "device dependent," and without knowing the precise output colorimetry the result "is likely to be different from the printed result." Same C/M/Y/K, different press or stock, different color. So a generic sRGB-to-CMYK figure would be a guess dressed up as data.
Pantone is even less convertible: it's a proprietary, licensed system of physical spot inks, mixed to a guarded formula and referenced against a printed Formula Guide — not something an RGB value maps onto by arithmetic. If your work is going to print, skip the on-screen conversion. Use your design app's color-managed export instead: assign the printer's ICC profile in Illustrator, InDesign or Affinity and let it do the conversion, or ask your print shop for the profile they run. That path is measured against a real press; a number typed here never could be.
Convert #0b7a55 to RGB and HSL by hand
The math is simple enough to do on paper. Take the site's accent green, #0b7a55, and split the hex into red, green and blue.
- Split the six digits into three pairs: 0b, 7a, 55.
- Read each pair as base 16: 0b = 0×16 + 11 = 11, 7a = 7×16 + 10 = 122, 55 = 5×16 + 5 = 85. That gives rgb(11, 122, 85).
- Scale each channel to 0–1 for HSL: R = 11/255 = 0.043, G = 122/255 = 0.478, B = 85/255 = 0.333.
Now take the largest channel (green, 0.478) and the smallest (red, 0.043). Their gap, 0.435, drives saturation and hue.
| HSL part | Formula (max = G, min = R) | Result |
|---|---|---|
| Lightness | (0.478 + 0.043) / 2 | 0.261 → 26% |
| Saturation | (0.478 − 0.043) / (0.478 + 0.043) | 0.835 → 83% |
| Hue | 60 × ((0.333 − 0.043) / 0.435 + 2) | 160° |
The answer is hsl(160, 83%, 26%). The simple saturation formula above holds while lightness sits below 50%; hue uses the +2 offset because green is the largest channel. Per MDN, HSL hue runs 0–360°, and saturation and lightness are percentages where 50% lightness is "normal." The tool does all of this instantly, but the arithmetic is standard and worth seeing once.
Reference tables
FAQ
How do I convert HEX to RGB?
A hex color is just red, green, and blue written in base 16: #0b7a55 means red 0b (11), green 7a (122), and blue 55 (85), so it equals rgb(11, 122, 85). Paste either form above and the tool converts both ways instantly.
Does it support transparency (alpha)?
Yes. It accepts 4- and 8-digit hex like #0b7a5580, rgba(), hsla(), and the modern slash syntax like rgb(11 122 85 / 50%). When alpha is below 1, the tool also shows rgba(), hsla(), and 8-digit hex outputs.
Which color formats can I type in?
Hex (3, 4, 6, or 8 digits), rgb()/rgba() and hsl()/hsla() in both the legacy comma and modern space syntax, plus all CSS named colors like rebeccapurple. Newer color spaces such as lab(), oklch(), and display-p3 aren’t supported — the tool focuses on the classic sRGB formats.