Blog
Unit converters

HEX to RGBA converter

Enter a HEX color code — plain (#3B82F6) or with an alpha channel (#3B82F6CC) — and, if needed, a separate transparency value from 0 to 1. The converter assembles a ready-made RGBA string with a swatch shown on a checkered background.

Your data never leaves this device

If you enter an 8-digit HEX (e.g. #3B82F6CC), this field is ignored — transparency comes from the last two HEX digits.

Result

rgba() string
Red (R)
Green (G)
Blue (B)
Transparency (A)

This page has no server side at all. The table you paste is parsed by JavaScript inside your own browser, the chart is drawn on a canvas element on your machine, and the export file is assembled locally. Nothing is uploaded, stored or written to any log. You can disconnect from the network after the page has loaded and everything will still work — which is the simplest way to verify the claim yourself.

Facts and limits of this method

6-digit HEX An opaque color — transparency comes from the separate field
8-digit HEX The last two digits are the alpha channel in hexadecimal (00–FF)
Transparency range 0 (fully transparent) to 1 (fully opaque)
Color swatch Shown on a checkered background so transparency is visible

When it misleads you

How it is calculated

If the HEX code is 8 digits, the last two are interpreted as the alpha channel: converted from a hex number (0–255) to a fraction from 0 to 1 by dividing by 255.

If the HEX code is 3 or 6 digits (no alpha channel), transparency is taken from the separate input field, clamped to the 0–1 range.

The remaining six digits are parsed the same way as in the HEX to RGB converter — a pair for each of the red, green, blue channels.

The final rgba() string is assembled from four values: three whole R/G/B numbers and a fractional transparency value rounded to two decimal places.

Questions and answers

What is an 8-digit HEX?

A regular 6-digit HEX color code with two extra alpha-channel digits appended — for example, #3B82F6CC, where "CC" sets the transparency.

How do I set transparency with a regular 6-digit HEX?

Enter the value you want from 0 to 1 in the separate "Transparency" field — it's only used when the HEX code doesn't have its own alpha channel.

Why is the swatch shown on a checkered background?

That's the standard way design tools display transparency — the checkered pattern shows through a semi-transparent color instead of a plain white background.

Is my data sent anywhere?

No, the whole calculation runs in your browser.

Related tools

All tools