Decoding 8-Digit HEX Colors
To convert a HEX code with alpha transparency into an RGBA value, paste your code into the converter above. The tool will instantly split the string, calculate the base-10 values for the red, green, and blue channels, and convert the final two characters into a decimal opacity percentage.
For years, web developers relied on 6-digit HEX codes for solid colors and the rgba() function when they needed transparency. With the introduction of 8-digit HEX codes in modern CSS, you can now define opacity directly within the base-16 string.
The Math Behind the Alpha Channel
In a standard 6-digit HEX code (like #3498db), the characters are grouped into three pairs representing Red, Green, and Blue. In an 8-digit HEX code (like #3498db80), a fourth pair is appended to the end to represent the Alpha channel.
Converting this final pair into a standard CSS decimal requires two steps:
- Convert to Base-10: Translate the hexadecimal pair into a standard integer between 0 and 255. For example, the hex value
80converts to 128. - Scale to a Decimal: Divide that integer by 255 to get a value between 0.0 and 1.0. So, 128 ÷ 255 equals approximately
0.50.
Common alpha hex pairs include FF (100% opaque), 80 (50% transparent), and 00 (completely invisible).
4-Digit Shorthand HEX
Just as a 3-digit HEX code (#f06) is shorthand for a 6-digit code (#ff0066), a 4-digit HEX code is shorthand for an 8-digit code. If you input #f068, the browser expands it by duplicating every character, resulting in #ff006688. The final 88 pair translates to roughly 53.3% opacity.
Modern CSS Syntax
While this tool is often used to find legacy rgba(r, g, b, a) values, modern CSS Color Module Level 4 treats the comma-separated form as a legacy syntax. The converter outputs the modern, space-separated format by default: rgb(r g b / a).