HEX

HEX to RGB Converter

Details

How to use HEX to RGB Converter

What the tool does, how to run it, and what to expect from the result.

How to convert HEX to RGB

A hex colour is three bytes written in hexadecimal: two digits each for red, green, and blue. Converting to RGB reads those bytes as decimal numbers from 0 to 255, which is the form CSS functions, canvas APIs, and image libraries expect.

The conversion runs in your browser and also gives you the HSL equivalent, which is useful for reasoning about a colour's hue and for nudging it lighter or darker within a family.

  • Paste the hex value, with or without the leading hash, in either the three-digit or six-digit form.
  • Read the RGB values, each from 0 to 255.
  • Copy the rgb() or hsl() string straight into your stylesheet.
  • Strip any alpha digits first if your value is in the four-digit or eight-digit form, since those are not parsed here.
  • Remember that HSL lightness is geometric rather than perceptual, so equal steps in L are not equal steps to the eye.
Tips

Getting a better result out of HEX to RGB Converter

Specific settings and thresholds, not general advice.

  • Three-digit hex expands by doubling each digit, not by padding with zeros. So #abc becomes #aabbcc, not #a0b0c0, which means the shorthand can only express 4,096 of the 16.7 million colours available. If a shorthand colour looks slightly off against the design, that is why.
  • Hex and RGB are gamma-encoded sRGB values, not linear light. The middle grey #808080 has about 22% of the luminance of white, not 50%, which is why averaging two colours channel by channel gives a result darker than a physical mix would.
  • HSL lightness is not perceived brightness. hsl(60, 100%, 50%) is a blinding yellow and hsl(240, 100%, 50%) is a deep blue, yet both claim a lightness of 50%. If you are building a colour ramp with even steps, HSL will betray you, and OKLCH is what fixes it.
  • The four-digit and eight-digit hex forms carry an alpha channel, so #ff000080 is red at 50% opacity, and every current browser supports them. This tool does not parse them, so strip the alpha before converting.
  • CSS colour keywords are not accepted here. There are 148 of them, and their values are not memorable: rebeccapurple is #663399, and it exists as a memorial to Eric Meyer's daughter.
Limits

What HEX to RGB Converter does not do

The honest boundary, so you do not lose time finding it yourself.

  • It does not parse the four-digit or eight-digit hex forms, so an alpha channel cannot be given.
  • It does not accept CSS colour keywords such as tomato or rebeccapurple.
  • The rgba output always has an alpha of 1, since there is no opacity input.
  • It does not output modern perceptual colour spaces such as OKLCH or Lab, which is what a design system should be built in.
At a glance

Who HEX to RGB Converter is for

A quick way to understand who this helps, what it solves, and where it connects next.

Best fit

Designers, frontend developers, and anyone working with color.

Ideal for

Quick color work without opening a heavier design tool.

FAQ

Common questions

Short answers for the questions people usually have before trying a utility like this.

Is the HEX to RGB converter free?

Yes. It is completely free to use, with no signup, no account, and no paywall.

Do I need to install anything?

No. It runs in any modern browser on desktop or mobile, with nothing to download and nothing to configure.

Does it stay local?

Yes. All the color math runs entirely in your browser, and nothing is sent to a server.

How does three-digit hex expand?

Each digit is doubled, so #abc becomes #aabbcc and #f00 becomes #ff0000. It is not padded with zeros, which is the common misconception, and the difference matters: doubling gives #aabbcc, whereas padding would give #a0b0c0, a visibly different colour. The consequence of the doubling rule is that the shorthand can only express 4,096 distinct colours, one for every combination of three hex digits, which is why a designer's exact value rarely survives being written in shorthand.

Why does the HSL value look wrong for my colour?

It is probably correct and not saying what you think. HSL lightness is a geometric construct, not a perceptual one: it is the midpoint between the largest and smallest RGB channels. That means a saturated yellow and a saturated blue both report a lightness of 50% despite one being far brighter to the eye. HSL is convenient for nudging a colour lighter or darker within a hue, and it is a poor foundation for a palette with even perceptual steps, which is exactly the gap OKLCH was designed to close.

Can I convert a colour with transparency?

Not here. The four-digit and eight-digit hex forms append an alpha channel, so #ff000080 is red at roughly 50% opacity, and every modern browser understands them. This converter accepts the three-digit and six-digit forms only, so remove the alpha digits before pasting, and add the opacity back in your rgba or hsla output afterwards.

Is #808080 half as bright as white?

No, and this trips up almost everyone doing colour maths. sRGB values are gamma-encoded, which means the numbers are not proportional to physical light. Middle grey at #808080 emits roughly 22% of the luminance of #ffffff, not 50%. This is why blending two colours by averaging their channels produces a result that looks too dark, and why contrast calculations require converting to linear light first rather than working with the hex values directly.

Does the conversion happen locally?

Yes. It is arithmetic on three numbers, performed in your browser, with nothing transmitted.

Recommendations

You Might Also Like

Nearby tools from the catalog that fit the same job or workflow.

Cleanor app

Do it all on your device

Cleanor puts these tools in one app: compress and convert images, video, and audio, work with PDFs, and scan text right on your device. Plus free up storage and clear inbox clutter with Email Cleaner. Start with a free trial.

  • iPhone
  • Android
  • Macsoon
  • Windowssoon