HEX to RGB Converter
Use this free online hex to rgb converter to switch any hexadecimal color code into clean RGB or RGBA channels. Whether adjusting an opacity percentage for an overlay or building UI tokens, get accurate CSS color format outputs in real time.
What Is a HEX to RGB Converter?
A hex to rgb converter translates a 6-digit or 8-digit hexadecimal color code into standard RGB values (0–255) and RGBA channels. Web browsers read both, but RGB and RGBA allow dynamic alpha channel adjustments for semi-transparent styling in CSS.
When styling modern web apps, you often need to convert hex color code to rgba with opacity for overlays, card borders, and shadow gradients. Using a dedicated hex to rgb converter for css avoids manual base-16 math and keeps color swatch values consistent across your UI code.
HEX to RGB Math Formula & Alpha Calculation
A 6-character hex code represents three base-16 byte pairs. To convert each channel to base-10 RGB values (0–255), multiply the first character by 16 and add the second character:
R = (Hex₁ × 16) + Hex₂
G = (Hex₃ × 16) + Hex₄
B = (Hex₅ × 16) + Hex₆
Alpha = (Hex₇ × 16 + Hex₈) / 255Note: 3-digit shorthand values like #369 expand to #336699 before running the calculation. For 8-digit hex with alpha, the last two digits determine opacity between 0.0 and 1.0.
How to Convert HEX to RGB Step-by-Step
Clean the Hex Input String
Remove the leading hash (#) if present. If you have a 3-character hex shorthand (like #F53), duplicate each character to produce the 6-character string (#FF5533).
Split Into Color Pairs
Break the 6-digit hex string into three 2-character components corresponding to Red, Green, and Blue channels.
Convert Hex Pairs to Base-10 Decimals
Map letters A–F to numbers 10–15, then calculate (Digit 1 × 16) + Digit 2 for each pair:
Format the Final CSS Output
Assemble the converted numbers into your target CSS color format, adding an alpha channel if you need opacity.
rgb(255, 87, 51) or rgba(255, 87, 51, 0.9)Frequently Asked Questions
how do I convert a hex color to RGB?
Split your 6-digit hex string into three pairs. Convert each base-16 pair into standard base-10 numbers to get your red, green, and blue coordinates. For example, #FF5733 splits into FF (255), 57 (87), and 33 (51), giving rgb(255, 87, 51).
what is the RGBA equivalent of a hex code?
The RGBA equivalent takes the standard RGB values and appends an alpha channel for transparency. The alpha value scales from 0.0 (completely transparent) to 1.0 (fully opaque). For #FF5733 at 80% opacity, the RGBA string is rgba(255, 87, 51, 0.8).
how do you calculate opacity from hex (8-digit hex to alpha)?
Take the last two characters of an 8-digit hex code, convert that pair from hexadecimal to a decimal number (0–255), and divide it by 255. For instance, #FF5733CC has an alpha pair of CC (204). Dividing 204 by 255 yields an alpha of 0.8 (80% opacity).
what does the "A" in RGBA stand for?
The "A" stands for Alpha. The alpha channel defines the opacity percentage of a color swatch, allowing background elements to show through layers in CSS.
HEX to RGB / RGBA Converter
* Color math follows standard W3C CSS Color Module Level 4 specifications. Conversions run 100% client-side in real time.
Check out 4 similar collection of design-tools calculators