ZonoTools
Home/Color & Design/HEX to RGB

HEX to RGB

Color Convert Engine

Enter a color in any supported format; the engine outputs every other color space.

Input Mode

Accepts #RGB or #RRGGBB, with or without #.

Preview

#1E40AF

Preview uses the sRGB color space.

Output — all color spaces

HEX#1E40AF
RGBrgb(30, 64, 175)
HSLhsl(226, 71%, 40%)
HSVhsv(226, 83%, 69%)
CMYKcmyk(83%, 63%, 0%, 31%)
LABlab(31.89, 30.44, -62.30)
LCHlch(31.89, 69.34, 296.04)
OKLABoklab(0.4244, -0.0138, -0.1803)
OKLCHoklch(0.4244, 0.1809, 265.64)

How to use

  1. Enter a valid HEX color such as #1e40af or shorthand #0af, then confirm the preview matches the color you expect.
  2. Watch for shorthand and missing # issues because mistyped HEX input can produce a completely different RGB result.
  3. Verify the converted value in the environment where you need it, such as CSS, design tokens, or canvas code.

FAQ

What is HEX to RGB used for?

HEX to RGB is used when you need to convert hexadecimal color codes into RGB or RGBA values for CSS, design systems, or UI development.

Is my data uploaded?

No. Processing runs locally in your browser.

Does this tool support shorthand HEX values?

Yes. It supports both shorthand HEX values like `#0af` and full six-character values like `#00aaff`.

Introduction

HEX notation encodes the red, green, and blue channels as base-16 pairs in a # string—usually #RRGGBB or the shorthand #RGB. That is what we treat as the from (HEX) color encoding on this page.

RGB expresses the same additive color as three decimal channels—red, green, and blue—most often integers from 0 to 255 per channel on the web. That is the to (RGB) encoding you get after conversion.

A HEX to RGB converter bridges them when your pipeline outputs HEX but the next step expects RGB—without redoing the coordinate math by hand.

What is HEX to RGB?

HEX to RGB converts a color written in hexadecimal notation into red, green, and blue channel values.

HEX uses pairs of base-16 digits to represent each color channel. RGB expresses the same color as three decimal numbers, usually in the range 0-255.

This means the conversion does not change the color itself. It only changes the way the color is represented.

Key Features

Instant conversion is useful when you need both RGB and RGBA output for different parts of a frontend stack.

Live preview helps catch input mistakes quickly, especially when a single character typo changes the color entirely.

Copy-ready output speeds up handoff into CSS, theme files, or component props without manual rewriting.

Common Use Cases

  • Converting a brand HEX value from a Figma handoff into rgb() for CSS animations or gradients.
  • Generating rgba() output when you need the same base color with adjustable alpha in overlays or shadows.
  • Translating color tokens for libraries or APIs that accept decimal channel values instead of HEX.

Best Practices

  • Verify whether your target code needs rgb() or rgba() before copying the result.
  • Normalize shorthand colors before debugging so all team members compare the same full value.
  • Recheck the preview when copying from external docs because invisible whitespace can break pasted input.

Related tools

These sit next to HEX to RGB in a typical design-to-code flow: pick a color, convert it, then plug the values into CSS or a component library.

  • Color Converter — Jump between HEX, RGB, HSL, and other spaces from one hub when you are not sure which notation your stack expects yet.
  • RGB to HEX — Go the other way when you already have rgb() numbers from an API or canvas output and need a compact # code for tokens or handoff.
  • HEX to HSL — Same HEX input as here, but tuned for HSL when you are tweaking lightness for themes or hover states.
  • Color Picker — Sample or dial in a color visually, then copy HEX or RGB without guessing channel values by hand.