Home/Tools/Utilities/HEX to RGB Converter

Utilities · Generator

HEX to RGB Converter

Convert HEX colors to RGB, RGBA, HSL, and CSS custom properties — with a bulk converter.

Single Color

Pick a Color

Alpha1

HEX

#0071E3

RGB

rgb(0, 113, 227)

RGBA (alpha: 1)

rgba(0, 113, 227, 1)

HSL

hsl(210, 100%, 45%)

CSS Custom Property

--color: 0 113 227;

Color Preview

HEX: #0071E3RGBA: 0, 113, 227, 1

Bulk Converter

One HEX per line (with or without #)

100%

Free, no
sign-up needed

Code written
by hand

85+

CSS tools
in one place

<1s

Copy-ready
CSS instantly

What is this

What is the HEX to RGB Converter?

Convert HEX colour codes to RGB values instantly. Supports 3-digit and 6-digit HEX, with and without the # prefix.

Everything runs locally in your browser. Adjust the controls above, preview instantly, and copy clean, production-ready CSS — no account, no upload.

How to use

Using the HEX to RGB Converter

Everything lives in the panel at the top of this page. There is nothing to install — it all runs right here in your browser.

Enter your HEX code

Type or paste a 3 or 6 digit hex code, with or without the # prefix. The converter accepts all common formats.

Get the RGB output

The RGB and RGBA values appear instantly. Each channel (red, green, blue) is displayed separately for easy reference.

Copy the format you need

Click Copy next to rgb() or rgba() to grab the value. Or copy individual channel numbers to use in custom property definitions.

The output

What the generated code looks like

Clean, production-ready CSS — no vendor bloat, no unnecessary declarations.

styles.css

/* HEX input */
color: #6C2EF5;

/* RGB output */
color: rgb(108, 46, 245);

/* RGBA - add alpha for transparency */
color: rgba(108, 46, 245, 0.5);

/* As CSS custom property components */
--brand-rgb: 108, 46, 245;
.tint { background: rgba(var(--brand-rgb), 0.1); }

Storing colour components as --brand-rgb: r, g, b lets you compose rgba() values at any opacity without redefining the colour.

Pro tips

Pro tips for better results

★

3-digit HEX is shorthand for 6-digit

#f0a is identical to #ff00aa. Each digit is doubled: f becomes ff, 0 becomes 00, a becomes aa. The converter accepts both forms.

★

Store components as CSS custom properties for flexibility

Define --brand: 108, 46, 245 (just the numbers), then compose: rgb(var(--brand)) for solid or rgba(var(--brand), 0.5) for transparent versions anywhere in your CSS.

★

rgb() and rgba() are interchangeable in modern CSS

In Chrome 65+, Firefox 52+, and Safari 12.1+, rgb() accepts a fourth alpha parameter: rgb(108 46 245 / 50%). The rgba() four-argument form still works everywhere.

FAQ

Frequently asked questions

They represent the same colour values in different notations. HEX uses base-16 (hexadecimal): #6C2EF5 means R=6C, G=2E, B=F5. RGB uses base-10 decimal: rgb(108, 46, 245). They are mathematically equivalent.

Use rgba() for transparency: rgba(108, 46, 245, 0.5) is 50% transparent. HEX also supports 8-digit transparency (#6C2EF580), but rgba() is more readable and better-supported in older code.

No. The conversion runs in your browser. Nothing is sent to a server.