100% Free • Sub-50ms Reactive Tool

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

Convert CSS RGBA color values to HEX codes (and vice-versa) in real time. Features full support for 8-digit hex transparency (#RRGGBBAA), opacity slider, split checkerboard preview, and instant code export for CSS, Swift, and Flutter.

Quick Presets:

RGBA Channel Inputs

Red Channel 0 – 255
Green Channel 0 – 255
Blue Channel 0 – 255
Opacity / Alpha Channel 0% – 100%
Accepts 3, 4, 6, and 8-character hex values (e.g., #3B82F6 or #3B82F6D9).

Transparency Preview

Over Grid
Over Dark
Over Light
8-Digit Alpha Hex (Modern CSS)
#3B82F6D9
CSS RGBA Syntax
rgba(59, 130, 246, 0.85)
Modern CSS rgb() with Slash Alpha
rgb(59 130 246 / 85%)
Apple SwiftUI Color
Color(red: 0.23, green: 0.51, blue: 0.96, opacity: 0.85)
Flutter / Android ARGB Hex
Color(0xD93B82F6)
Alpha Byte Calculation:
0.85 × 255 = 217 → 0xD9
Hex Suffix
D9

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:

  1. 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
  2. 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"
  3. Concatenate the 8-Digit Hex String: Combine # + Red_Hex + Green_Hex + Blue_Hex + Alpha_Hex:
    #3B82F6 + D9 = #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 Action
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

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 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. Our converter above automatically outputs both formats so you never accidentally reverse your alpha channel when switching between Web and mobile codebases.

Why did rgba() change in modern CSS?

The CSS Working Group unified color functions. In modern CSS, rgba() is an alias of rgb(). Modern CSS allows space-separated values with a forward slash for alpha: rgb(59 130 246 / 85%). Both notations are 100% valid, and Pikka provides both snippets for copy-paste convenience.

Need to generate complete palettes from this color?

Load your converted color directly into Pikka Web Studio to calculate Complementary, Triadic, and Analogous harmonies, or test WCAG 2.1 compliance.

Open in Pikka Web Studio →