RGBA to Hex Converter

An RGBA to hex converter takes a color with transparency — say rgba(37, 99, 235, 0.85) — and packs all four channels into a single hex string. Sounds trivial. It usually is, until you copy that hex into an Android layout, a Unity material, or a .NET color constant and the blue comes out wrong. The math behind the conversion is simple arithmetic. The part that bites people is where the alpha byte goes, and that depends entirely on the platform you're pasting into.

The Paste That Quietly Breaks a Color

Here's a real failure. A designer hands you rgba(37, 99, 235, 0.85) for an overlay. You convert it to #2563EBD9 and paste it into an Android color resource. The overlay renders as a flat, near-opaque teal instead of a translucent blue. Nothing errored. The hex was valid. The problem: Android reads hex as #AARRGGBB — alpha first — so it read your D9 as the red-ishleading byte and shoved every channel one slot over. Same eight characters, completely different color. This single ordering difference causes more "why is my transparency broken" bugs than any rounding error ever will.

Turning Three Channels Into Six Characters

Start with the easy part. Each of red, green, and blue is a number from 0 to 255. Hex is base-16, so two hex characters cover exactly 0–255 (16 × 16 = 256 values). To convert a channel, divide by 16 for the first character and take the remainder for the second. Blue 235 ÷ 16 = 14 remainder 11. In hex, 14 is E and 11 is B, so 235 becomes EB.

Do that for all three channels of rgb(37, 99, 235): 37 becomes 25, 99 becomes 63, and 235 becomes EB. Concatenate them and you have #2563EB — the solid color, no transparency yet. If you only ever need that solid form, our RGB to hex converter skips the alpha step entirely.

The Fourth Pair: Where Alpha Goes

Alpha is the odd one out. RGB channels are already 0–255, but CSS alpha is a decimal from 0 to 1. To turn it into a hex pair you first scale it up: multiply by 255, round to the nearest whole number, then convert to base-16. For alpha 0.85: 0.85 × 255 = 216.75, which rounds to 217, and 217 in hex is D9.

Tack that pair onto the end and the web 8-digit hex is #2563EBD9. The format is #RRGGBBAA — red, green, blue, then alpha. That trailing position is the whole reason 8-digit hex stays readable: the first six characters are the exact same code a non-transparent color would use, so a tool that ignores alpha still reads the right base color. Going the opposite way — hex back to an alpha slider — is what our hex to RGBA converter handles.

Alpha Last vs. Alpha First Across Platforms

This is the table to bookmark. The same translucent blue gets written four different ways depending on where it lives, and three of them reorder the bytes:

Notice the web and Android hex codes share the exact same eight characters — D9, 25, 63, EB— just rotated. That's what makes the bug so slippery: nothing looks malformed. The converter above outputs both orderings side by side so you never have to mentally shuffle the pairs.

When a Color Is Just One Big Number

Game engines, desktop frameworks, and graphics APIs often store a color as a single 32-bit integer rather than a string. The four bytes stack in one number, usually as ARGB: alpha occupies bits 24–31, red 16–23, green 8–15, and blue 0–7. You build it with bit shifts: (A << 24) | (R << 16) | (G << 8) | B.

For our blue at 85% alpha, that's alpha 217, red 37, green 99, blue 235. Packed together you get the unsigned integer 3646014955, or 0xD92563EBin hex literal form — which, notice, is identical to the Android string minus the hash. That's not a coincidence: the Android #AARRGGBB hex isthe ARGB integer written in base-16. Once you see that, the "four formats" collapse into two ideas: the byte order, and whether it's a string or a number.

Worked Example: rgba(37, 99, 235, 0.85)

Let's convert the full color start to finish so you can verify the tool by hand:

• Red 37 → 37 ÷ 16 = 2 r5 → 25
• Green 99 → 99 ÷ 16 = 6 r3 → 63
• Blue 235 → 235 ÷ 16 = 14 r11 → EB
• Alpha 0.85 → 0.85 × 255 = 216.75 → round 217 → 217 ÷ 16 = 13 r9 → D9

Assemble in web order: #2563EB + D9 = #2563EBD9. Reorder for Android: D9 + 2563EB = #D92563EB. Pack as an integer: 217·16,777,216 + 37·65,536 + 99·256 + 235 = 3,646,014,955. Three formats, one color, all from the same four bytes. To adjust the hue or lightness afterward, an HSL conversion is far easier than nudging hex pairs by hand.

When 8-Digit Hex Is the Wrong Output

8-digit hex isn't always the right target, and pretending it is causes its own bugs.

• You still support Internet Explorer 11. IE11 never parsed #RRGGBBAA and would drop the whole declaration, leaving an unstyled element. Ship rgba() instead — it works back to IE9.
• You need a runtime-adjustable opacity. If a slider or animation changes transparency on the fly, keep the color and alpha separate (CSS custom properties or rgb() with a variable). Baking alpha into a frozen hex string means regenerating it on every change.
• The target is a print or spot color. Hex describes screen RGB light, not ink. For anything heading to a press you want a CMYK build, and alpha has no meaning in CMYK at all.

The Rounding Traps That Shift Your Alpha

Round, never floor. The web spec and every major design tool round alpha. So 0.5 × 255 = 127.5 becomes 128 (80), not 127 (7F). A converter that floors gives you 7Fand a color that's one step more transparent than the source — invisible on screen, but enough to fail a pixel-diff test.

Watch the low-alpha look-alikes. 10% alpha is 1A (26), and 1A looks exactly like a normal color pair. When debugging an 8-digit hex, count the characters: six means no alpha, eight means the last (web) or first (Android) pair is opacity, never a color.

Don't fade to transparent black. The CSS keyword transparent is #00000000 — zero alpha black. Use it as a gradient endpoint over a non-black color and a gray fringe creeps in. Fade to your real color at zero alpha instead, like #2563EB00. The precise rules live in the MDN hex-color reference and the W3C CSS Color 4 hex notation spec.