Hex Color Opacity (Alpha) Calculator
Turn an opacity percentage into the two-digit alpha HEX (50% = 80), get #RRGGBBAA, Android #AARRGGBB and rgba(), and the flattened color over a background.
An 8-digit HEX color stores opacity in its last two digits: #2563EB80 is the blue #2563EB at about 50% opacity. This calculator turns any opacity percentage into that two-digit alpha code, writes the color in CSS order (#RRGGBBAA), Android order (#AARRGGBB) and as rgba(), and shows the solid color you get when the translucent color sits on white, black or your own background. A full table covers 0–100% in 5% steps.
How to use this tool
- Enter the opacity in percent.
- Enter the base color (any HEX, rgb() or CSS name).
- Choose the background to see the flattened, opaque equivalent.
- Copy the code for CSS, or the #AARRGGBB form for Android and .NET.
Formula
alpha byte = round(opacity% × 255) → two hex digits · flattened channel = color × a + background × (1 − a), with a = byte ÷ 255
Because alpha has only 256 steps, most percentages are rounded: 50% becomes 128/255 = 50.2%. 100% is FF and 0% is 00.
Example
At 50%, 0.5 × 255 = 127.5 rounds to 128, which is 80 in hex, so blue #2563EB becomes #2563EB80 (Android: #802563EB). Over white it looks like the solid color #92B1F5: red 37 × 0.502 + 255 × 0.498 ≈ 146 = 92, and so on. 75% gives BF, and the alpha HEX CC means exactly 80%.
Frequently asked questions
What is the HEX code for 50% opacity?
80. Opacity 50% × 255 = 127.5, rounded to 128 = 0x80. Some tools round down to 7F (127); both are within half a percent.
Why does Android put the alpha first?
Android, .NET and many graphics APIs store colors as 32-bit ARGB integers, so alpha comes first: #80FF0000 is half-transparent red. CSS Color 4 chose #RRGGBBAA instead, so the same digits mean different colors in CSS and Android.
Do all browsers support 8-digit HEX?
Yes, all current browsers (Chrome 62+, Firefox 49+, Safari 10+) read #RRGGBBAA and the 4-digit #RGBA shorthand.
Sources
Last updated:
Page address with these inputs: https://kakao.mobile/tools/alpha-to-hex-tool/
Cite or embed this tool
kakaoCalc. (2026, November 8). Hex Color Opacity (Alpha) Calculator. https://kakao.mobile/tools/alpha-to-hex-tool/
“Hex Color Opacity (Alpha) Calculator.” kakaoCalc, 8 Nov. 2026, kakao.mobile/tools/alpha-to-hex-tool/.
Paste this code into your page. The widget runs in your visitors' browsers, shows no ads and keeps a link back to this page. Embedding terms