colorize
ColorKit
CK

HEX to RGB Converter

Instantly convert hexadecimal web colors to RGB format.

rgb(255, 87, 51)

What does HEX to RGB do?

This converter translates a 6-digit or 3-digit Hexadecimal (HEX) web color code into a standard Red, Green, and Blue (RGB) format instantly in your browser.

How do you convert HEX to RGB?

HEX and RGB are two different numerical bases for the exact same color space. A HEX code is split into three Base-16 pairs representing Red, Green, and Blue. To convert to RGB (Base-10), you multiply the first character of each pair by 16 and add the second character.

What is the mathematical formula?

If you have the HEX code #FF5733:

  • Red (FF): (15 × 16) + 15 = 255
  • Green (57): (5 × 16) + 7 = 87
  • Blue (33): (3 × 16) + 3 = 51

Therefore, #FF5733 equals rgb(255, 87, 51).

What formats are supported?

The input securely accepts standard 6-digit codes (#FF5733) and 3-digit shorthand codes (#F00, which expands to #FF0000). The pound symbol (#) is optional. The tool instantly validates the format before generating the output locally.

JavaScript Code Example

If you need to implement this exact logic locally in your own application, here is our core zero-dependency function:

function hexToRgb(hex) {
  let clean = hex.replace(/^#/, '').trim();
  if (clean.length === 3) clean = clean.split('').map(c => c + c).join('');
  const val = parseInt(clean, 16);
  return { r: (val >> 16) & 255, g: (val >> 8) & 255, b: val & 255 };
}

Related Converters

Need to go the other way? Use our RGB to HEX Converter ⇄.

Knowledge Base & FAQ

Frequently Asked Questions

Direct answers and solutions to common questions, technical challenges, and industry standards.

How is HEX converted to RGB mathematically?expand_more
A 6-character HEX color code is split into three base-16 pairs: Red (R), Green (G), and Blue (B). To convert each pair into standard base-10 decimal RGB (0–255), multiply the first character's hexadecimal value by 16 and add the second character's value (where A=10, B=11, C=12, D=13, E=14, F=15). For example, #FF5733 translates to:
  • Red (FF): (15 × 16) + 15 = 255
  • Green (57): (5 × 16) + 7 = 87
  • Blue (33): (3 × 16) + 3 = 51
Resulting in rgb(255, 87, 51).
How do 3-digit shorthand HEX codes expand to RGB?expand_more
A 3-digit hex code like #FA3 is shorthand for a 6-digit code where each individual character is duplicated. In web browsers, #FA3 expands to #FFAA33:
  • F → FF = 255
  • A → AA = 170
  • 3 → 33 = 51
Yielding rgb(255, 170, 51). This shorthand saves stylesheet bytes for common repeating values.
How do I extract alpha transparency from an 8-character HEX code?expand_more
In an 8-character hex code (#RRGGBBAA), the final two characters represent opacity from 00 (0% alpha) to FF (100% alpha). Convert the final pair to decimal and divide by 255. For example, in #FF573380, 80 in base-16 is (8 × 16) + 0 = 128. Dividing 128 / 255 = 0.50 (50% opacity), yielding rgba(255, 87, 51, 0.5) or CSS rgb(255 87 51 / 50%).
What is the difference between HEX and RGB in CSS?expand_more
HEX and RGB represent the exact same sRGB color space; they are simply different mathematical notations. RGB uses base-10 integers (0–255), which are easy for humans to calculate dynamically in JavaScript. HEX uses base-16 (00–FF), which is more compact and widely used as static color tokens in design tokens and configuration files.
How do I use RGB colors in modern CSS with alpha channels?expand_more
In modern CSS Color Module Level 4, you can use the streamlined space-separated syntax with a forward slash for alpha: background-color: rgb(255 87 51 / 75%); or rgb(255 87 51 / 0.75);. This eliminates the need for separate rgba() syntax and works across all modern web browsers.