Color Converter

About color formats

The same color can be written as HEX (#ff6600), RGB (rgb(255, 102, 0)), or HSL (hsl(24, 100%, 50%)) — three different ways of describing the identical color, each suited to a different situation.

HEX has a compact shorthand: a 3-digit code like #f60 is exactly equivalent to the 6-digit #ff6600 — each digit is simply doubled — and an 8-digit form like #ff6600cc adds an alpha channel the same way rgba() and hsla() do. This tool accepts and normalizes the shorthand form on input, and always outputs the full 6- or 8-digit form so the result is unambiguous to paste elsewhere. One thing it doesn't do: check colors for accessible contrast or simulate color-blindness — that's a distinct, and equally important, design question from format conversion.

Where you'll run into it

• Translating a designer's HEX swatch into the RGB or HSL a codebase already uses
• Adjusting lightness or saturation, which is far easier to reason about in HSL than in RGB
• Reading a color out of a browser's computed styles and converting it to match a design spec
• Checking what a CSS color value actually renders as before committing to it

Frequently asked

Why does HSL exist if RGB already works?
RGB describes a color as red/green/blue light intensities, which map poorly to how people think about color. HSL separates hue, saturation, and lightness, so "make it darker" or "make it more vivid" is a single number to change instead of recalculating three.

What does the alpha value in rgba()/hsla() mean?
It's opacity, from 0 (fully transparent) to 1 (fully opaque). This tool preserves it across formats — including as an 8-digit HEX — when your input includes one.

Does this support named CSS colors like "tomato"?
Not yet — only HEX, RGB(A), and HSL(A) input. Look up the named color's HEX value first if that's what you're starting from.

Is #f60 the same color as #ff6600?
Yes, exactly. The 3-digit HEX shorthand doubles each digit to get the full form: f becomes ff, 6 becomes 66, 0 becomes 00. It's purely a shorter way to write certain colors — only ones where each channel happens to be a repeated digit — not a different or lower-precision color space. This tool accepts either length and always outputs the full 6- or 8-digit form.