Free HEX to RGB Converter

Convert HEX color codes (#RRGGBB or shorthand #RGB) into RGB values instantly. This tool displays RGB output, HSL equivalents, and a live color preview—all in your browser, with no uploads.

RGB rgb(255, 87, 51)
HSL hsl(11, 100%, 60%)
HEX #FF5733

Quick answer

A HEX color code like #FF5733 converts to RGB values (255, 87, 51), where each hex pair represents red, green, and blue intensity from 0–255. The tool also shows HSL and displays the actual color in real time.

Formula & method

Paste or type a HEX color code into the input field. The tool accepts both full 6-digit codes (#RRGGBB) and shorthand 3-digit codes (#RGB, which expands to #RRGGBB). The converter instantly outputs the RGB values (three numbers 0–255), HSL values (hue, saturation, lightness), and renders a color swatch so you can preview the result.

Examples

Example 1: Web Orange to RGB
Input
#FF5733
Result
rgb(255, 87, 51)
Why
Hex pair FF = 255 (red), 57 = 87 (green), 33 = 51 (blue). This warm orange is commonly used in web design.
Example 2: Shorthand Black
Input
#000
Result
rgb(0, 0, 0)
Why
Shorthand #RGB expands to #000000. All three channels at 0 produce pure black.
Example 3: Brand Green
Input
#1A2B3C
Result
rgb(26, 43, 60)
Why
Hex 1A = 26, 2B = 43, 3C = 60. This deep blue-green is often seen in tech and finance branding.

When to use this tool

  • Converting web design mockups (Figma, Adobe XD) that use HEX codes into CSS/HTML RGB() values.
  • Matching colors across tools where one accepts HEX and another requires RGB input.
  • Checking exact brightness and color intensity by examining HSL values alongside RGB for accessibility and contrast decisions.

Common mistakes

  • Forgetting the # symbol: The tool requires #RRGGBB format; entering RRGGBB without the hash will not work.
  • Confusing shorthand expansion: #RGB shorthand triples each digit (so #F5C becomes #FF55CC, not #0F050C). The tool handles this automatically.
  • Assuming RGB is always 0–255: RGB values are always 0–255. HSL uses different scales (0–360 for hue, 0–100% for saturation and lightness), which the tool also displays.

Frequently asked questions

What's the difference between HEX and RGB?

HEX uses hexadecimal notation (#RRGGBB), compressing each color channel into two hex digits per color. RGB uses decimal notation (0–255) for each of red, green, and blue. Both represent the same color; they're just different formats. HEX is more compact in code, while RGB is more intuitive for numeric calculations.

Can I use shorthand HEX like #F5C?

Yes. Shorthand #RGB automatically expands by doubling each digit: #F5C becomes #FF55CC. This tool accepts both formats and instantly converts them to RGB.

What is HSL and why does the tool show it?

HSL (Hue, Saturation, Lightness) is an alternative color model that's often easier for humans to adjust. Hue is the color (0–360°), saturation is color intensity (0–100%), and lightness is brightness (0–100%). The tool displays HSL alongside RGB so you can choose whichever format suits your needs.

Is my data uploaded when I use this converter?

No. All conversions happen entirely in your browser. Your HEX codes are never sent to any server.

Which color format should I use in CSS?

Modern CSS supports all three formats: #RRGGBB (HEX), rgb(r, g, b), and hsl(h, s%, l%). Use whichever is most convenient for your workflow. HEX is most common in design tools; RGB is useful for programmatic color manipulation.

What if I enter an invalid HEX code?

The tool validates the input format. HEX codes must contain only 0–9 and A–F characters. If your input is invalid, the converter will not process it and may display an error or await valid input.

Sources & references

External references open in a new tab. We are independent and not affiliated with these organizations.

  • ✓ Free to use
  • ✓ No sign-up required
  • Runs entirely in your browser — nothing is uploaded.
  • ✓ Formula and method shown above

Provided “as is” for general information only — results may be inaccurate, so verify before you rely on them. No warranty; use at your own risk.

Built and reviewed by HIFreeTools against the formula shown above and any authoritative references cited on this page. See our methodology and editorial standards.

Related tools

Related guides

Embed this tool on your site

Free to embed, no sign-up. Paste this code where you want the hex to rgb converter to appear: