RGBA to HEX Converter (#RRGGBBAA Alpha Tool + Table)

Q: Do modern web browsers support 8-digit hex codes?

Yes! CSS Color Module Level 4 introduced 8-digit hexadecimal colors (#RRGGBBAA) and 4-digit hex shorthand (#RGBA). Supported across Chrome 62+, Firefox 49+, Safari 10+, and Edge 79+.

Q: What is the mathematical formula to convert RGBA opacity (0.0 to 1.0) into a 2-digit HEX alpha suffix?

Multiply decimal opacity (0 to 1) by 255, round to nearest integer, and convert to hexadecimal: Math.round(alpha * 255).toString(16).padStart(2, '0').toUpperCase(). For example, 0.85 * 255 = 217 -> D9.

Q: What is the difference between CSS 8-digit HEX and Android ARGB?

CSS uses RGBA ordering where Alpha is at the end (#RRGGBBAA). Android and Flutter use ARGB where Alpha comes first (0xAARRGGBB).

Q: How do you write RGBA transparency in Tailwind CSS v4 vs Tailwind v3?

In Tailwind CSS v3 and v4, apply opacity via the slash modifier: bg-blue-500/85 or arbitrary hex: bg-[#3B82F6D9]. In Tailwind v4 @theme, define colors directly using 8-digit hex: --color-primary: #3B82F6D9.

Q: Why did rgba() change to rgb(... / alpha) in modern CSS?

Under CSS Color Module Level 4, rgba() is aliased to rgb(). Modern CSS recommends space-separated notation with a slash: rgb(59 130 246 / 85%). Both notations are 100% valid.

Q: How do you convert 8-digit HEX back to RGBA?

Parse the last two hex characters with parseInt(hexAlpha, 16) and divide by 255. For example, parseInt('D9', 16) = 217; 217 / 255 = 0.85 -> rgba(59, 130, 246, 0.85).

How to Convert RGBA to HEX (The Mathematical Formula)

In digital color design, RGBA represents Red, Green, Blue, and Alpha (opacity). While traditional RGB uses decimal integers from 0 to 255, Alpha is typically expressed as a decimal floating-point number between 0.0 (completely transparent) and 1.0 (fully opaque).

A standard 6-digit hexadecimal color (e.g., #3B82F6) encodes only R, G, and B. To represent transparency in modern CSS and UI frameworks, an 8-digit hexadecimal color (#RRGGBBAA) adds two extra hex characters at the end to represent the Alpha channel.

The Step-by-Step Conversion Formula:

Convert Red, Green, and Blue: Divide each channel value by 16 to find the high nibble and modulo 16 for the low nibble, converting the decimal number (0–255) to a two-digit hexadecimal string (00–FF).
59 → 3B, 130 → 82, 246 → F6
Convert the Alpha Channel: Multiply the decimal alpha value (between 0 and 1) by 255, round to the nearest whole integer, and convert that integer to hexadecimal:
```
Alpha_Integer = round(Alpha_Float × 255)
Alpha_Hex = hex(Alpha_Integer)
```
For example, with an opacity of 0.85:
```
0.85 × 255 = 216.75 → 217 → Hex "D9"
```
Concatenate the 8-Digit Hex String: Combine # + Red_Hex + Green_Hex + Blue_Hex + Alpha_Hex:
#3B82F6 + D9 = #3B82F6D9

⚡ Programmatic RGBA to 8-Digit HEX Formula (JavaScript)

function rgbaToHex(r, g, b, a = 1) {
  const toHex = (n) => Math.round(Math.min(Math.max(n, 0), 255)).toString(16).padStart(2, '0').toUpperCase();
  const alphaHex = toHex(Math.round(Math.min(Math.max(a, 0), 1) * 255));
  return `#${toHex(r)}${toHex(g)}${toHex(b)}${alphaHex}`;
}

// Example usage:
console.log(rgbaToHex(59, 130, 246, 0.85)); // Returns "#3B82F6D9"

Complete 8-Digit Alpha Hex Transparency Lookup Table

Below is the authoritative reference chart for converting common opacity percentages to their exact 2-character hexadecimal suffix. You can click any row to instantly copy the corresponding hex alpha code.

Opacity %	Decimal (0.0 – 1.0)	8-Bit Value (0 – 255)	Hex Suffix (AA)	Example Code
100% (Opaque)	1.00	255	`FF`	`#3B82F6FF`
95%	0.95	242	`F2`	`#3B82F6F2`
90%	0.90	230	`E6`	`#3B82F6E6`
85% (High UI Contrast)	0.85	217	`D9`	`#3B82F6D9`
80% (Overlay / Modal)	0.80	204	`CC`	`#3B82F6CC`
75%	0.75	191	`BF`	`#3B82F6BF`
70%	0.70	179	`B3`	`#3B82F6B3`
65%	0.65	166	`A6`	`#3B82F6A6`
60%	0.60	153	`99`	`#3B82F699`
50% (Half Opacity)	0.50	128	`80`	`#3B82F680`
40%	0.40	102	`66`	`#3B82F666`
30%	0.30	77	`4D`	`#3B82F64D`
25% (Quarter Opacity)	0.25	64	`40`	`#3B82F640`
20% (Subtle Card Fill)	0.20	51	`33`	`#3B82F633`
15%	0.15	38	`26`	`#3B82F626`
10% (Glass Hairline Border)	0.10	26	`1A`	`#3B82F61A`
5% (Ultra-subtle glow)	0.05	13	`0D`	`#3B82F60D`
0% (Transparent)	0.00	0	`00`	`#3B82F600`

Frequently Asked Questions About RGBA & HEX

Do modern web browsers support 8-digit hex codes?

Yes! The CSS Color Module Level 4 introduced 8-digit hexadecimal colors (#RRGGBBAA) and 4-digit hex shorthand (#RGBA). All major modern web browsers support this syntax out of the box, including Google Chrome 62+, Mozilla Firefox 49+, Apple Safari 10+, and Microsoft Edge 79+.

What is the mathematical formula to convert RGBA opacity (0.0 to 1.0) into a 2-digit HEX alpha suffix?

Multiply the decimal opacity value by 255, round the result to the nearest integer, and convert that decimal integer (0 to 255) into a base-16 hexadecimal string padded with a leading zero if under 16: Math.round(alpha * 255).toString(16).padStart(2, '0').toUpperCase(). For example, 50% opacity (0.5) becomes 128, which is 80 in hex.

What is the difference between CSS 8-digit HEX and Android ARGB?

CSS uses RGBA ordering where Alpha is at the very end: #RRGGBBAA. In contrast, Android (Java/Kotlin) and Flutter use ARGB format where Alpha comes first: 0xAARRGGBB. Pikka's converter displays both formats simultaneously so you never accidentally invert alpha channels when transitioning between web and native mobile codebases.

How do you write RGBA transparency in Tailwind CSS v4 vs Tailwind v3?

In Tailwind CSS v3 and v4, you can apply opacity using the slash modifier: bg-blue-500/85 or arbitrary values: bg-[#3B82F6D9]. In Tailwind v4's modern @theme directive, you can define colors directly using 8-digit hex or modern CSS color functions: --color-primary: #3B82F6D9;.

Why did rgba() change to rgb(... / alpha) in modern CSS?

The W3C CSS Working Group unified functional color notations. Under CSS Color Module Level 4, rgba() is formally aliased to rgb(). Modern CSS recommends the space-separated syntax with a slash for alpha: rgb(59 130 246 / 85%). Both notations are 100% valid and supported in modern browsers.

How do you convert 8-digit HEX back to RGBA?

Take the last two hex characters (e.g. D9 in #3B82F6D9), convert from hex to decimal integer using parseInt("D9", 16) (which gives 217), and divide by 255: 217 / 255 = 0.85. The resulting CSS is rgba(59, 130, 246, 0.85).

RGBA to HEX Converter (With 8-Digit Alpha Support)

RGBA Channel Inputs

Transparency Preview

How to Convert RGBA to HEX (The Mathematical Formula)

The Step-by-Step Conversion Formula:

Complete 8-Digit Alpha Hex Transparency Lookup Table

Frequently Asked Questions About RGBA & HEX

Need to generate complete palettes from this color?