Color Tools

HEX to RGB Converter

Convert HEX color codes to RGB, HSL, HSV, and CMYK. Supports 3-digit shorthand hex and shows all color formats at once — copy any value instantly.

HEX / RGB / HSL / HSV
CMYK
3-digit Shorthand
All Formats at Once
Copy Instantly

HEX color

Picker

HEX

#6C63FF

RGB

rgb(108, 99, 255)

HSL

hsl(243, 100%, 69%)

HSV

hsv(243, 61%, 100%)

CMYK

cmyk(58%, 61%, 0%, 0%)

Red

108

Green

Blue

255

Hue

243°

Color Space Mathematics: Converting HEX to RGB & HSL

In digital graphic design and web development, colours are specified across multiple color models. While HEX notation represents red, green, and blue values in compact base-16 strings, RGB and HSL representations enable dynamic opacity blending (alpha channel) and algorithmic color adjustment.

HEX to RGB Mathematical Conversion

A six-character HEX code decomposes into three 2-digit hexadecimal bytes:

$$\text{HEX } #R_1R_2G_1G_2B_1B_2 \implies (R, G, B) = (16 \cdot R_1 + R_2,; 16 \cdot G_1 + G_2,; 16 \cdot B_1 + B_2)$$

Color Name	HEX Code	RGB Notation	HSL Notation
Pure White	`#FFFFFF`	`rgb(255, 255, 255)`	`hsl(0, 0%, 100%)`
Pure Black	`#000000`	`rgb(0, 0, 0)`	`hsl(0, 0%, 0%)`
Electric Indigo	`#6366F1`	`rgb(99, 102, 241)`	`hsl(239, 84%, 67%)`
Crimson Red	`#EF4444`	`rgb(239, 68, 68)`	`hsl(0, 84%, 60%)`

Converting HEX to RGB in Code

JavaScript

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

Modern CSS Color Module Level 4 & Color Gamuts

RGB Functional Notation: Modern CSS supports whitespace-separated syntax without commas: rgb(255 102 0 / 0.8).
Wide Gamut Displays: Displays supporting Display P3 can reproduce deeper reds, richer greens, and more vibrant emeralds than the standard sRGB triangle.
Alpha Blending Formula: When rendering a color with alpha $\alpha$, the resulting pixel color against a solid background $B$ is: $C_{\text{out}} = C \cdot \alpha + B \cdot (1 - \alpha)$.

Frequently Asked Questions

How do 3-digit shorthand HEX codes expand to 6-digit RGB values?: In 3-digit shorthand HEX notation (such as #F60), each character is duplicated to form a full byte (#FF6600). This maps directly to an RGB value of rgb(255, 102, 0).
When should developers use RGB functional notation over HEX?: RGB notation allows dynamic alpha transparency channel blending via rgb(r g b / alpha), which is easier to manipulate programmatically in CSS custom properties and JavaScript color interpolation routines.
What color formats does this tool convert to?: Enter a HEX color code and the tool outputs RGB (0–255), HSL (hue/saturation/lightness), HSV (hue/saturation/value), and CMYK values.
Does it support shorthand hex codes?: Yes. Enter a leading # or omit it. Three-digit shorthand codes such as #F0A are expanded to #FF00AA before conversion.
What is the difference between HSL and HSV?: HSL (Hue-Saturation-Lightness) uses lightness where 50% = pure color and 100% = white. HSV (Hue-Saturation-Value/Brightness) uses value where 100% = pure color.
Can I enter RGB values and get HEX back?: No. This tool accepts HEX input and converts it to RGB, HSL, HSV, and CMYK; it does not accept RGB input.
How do I convert HEX to RGB online?: Enter a HEX value, use the color picker or a preset if helpful, then copy the individual HEX, RGB, HSL, HSV, or CMYK result.
Is HEX to CMYK conversion exact for printing?: RGB and HEX describe screen light, while CMYK describes ink. CMYK results are useful approximations and do not guarantee printed color output.

Accuracy & Advisory Notice: HEX to RGB Converter

This website and utility are provided for general informational, calculation, and educational purposes only. Always verify critical computation outputs prior to professional deployment or financial use. See our Terms of Service and Privacy Policy for full governance details.

Loading tool...

Color Space Mathematics: Converting HEX to RGB & HSL

HEX to RGB Mathematical Conversion

A six-character HEX code decomposes into three 2-digit hexadecimal bytes:

$$\text{HEX } #R_1R_2G_1G_2B_1B_2 \implies (R, G, B) = (16 \cdot R_1 + R_2,; 16 \cdot G_1 + G_2,; 16 \cdot B_1 + B_2)$$

Color Name

HEX Code

RGB Notation

HSL Notation

Pure White

#FFFFFF

rgb(255, 255, 255)

hsl(0, 0%, 100%)

Pure Black

#000000

rgb(0, 0, 0)

hsl(0, 0%, 0%)

Electric Indigo

#6366F1

rgb(99, 102, 241)

hsl(239, 84%, 67%)

Crimson Red

#EF4444

rgb(239, 68, 68)

hsl(0, 84%, 60%)

Converting HEX to RGB in Code

JavaScript

Modern CSS Color Module Level 4 & Color Gamuts

RGB Functional Notation: Modern CSS supports whitespace-separated syntax without commas: rgb(255 102 0 / 0.8).

Wide Gamut Displays: Displays supporting Display P3 can reproduce deeper reds, richer greens, and more vibrant emeralds than the standard sRGB triangle.

Alpha Blending Formula: When rendering a color with alpha $\alpha$, the resulting pixel color against a solid background $B$ is: $C_{\text{out}} = C \cdot \alpha + B \cdot (1 - \alpha)$.

Frequently Asked Questions

How do 3-digit shorthand HEX codes expand to 6-digit RGB values?

In 3-digit shorthand HEX notation (such as #F60), each character is duplicated to form a full byte (#FF6600). This maps directly to an RGB value of rgb(255, 102, 0).

When should developers use RGB functional notation over HEX?

RGB notation allows dynamic alpha transparency channel blending via rgb(r g b / alpha), which is easier to manipulate programmatically in CSS custom properties and JavaScript color interpolation routines.

What color formats does this tool convert to?

Enter a HEX color code and the tool outputs RGB (0–255), HSL (hue/saturation/lightness), HSV (hue/saturation/value), and CMYK values.

Does it support shorthand hex codes?

Yes. Enter a leading # or omit it. Three-digit shorthand codes such as #F0A are expanded to #FF00AA before conversion.

What is the difference between HSL and HSV?

HSL (Hue-Saturation-Lightness) uses lightness where 50% = pure color and 100% = white. HSV (Hue-Saturation-Value/Brightness) uses value where 100% = pure color.

Can I enter RGB values and get HEX back?

No. This tool accepts HEX input and converts it to RGB, HSL, HSV, and CMYK; it does not accept RGB input.

How do I convert HEX to RGB online?

Enter a HEX value, use the color picker or a preset if helpful, then copy the individual HEX, RGB, HSL, HSV, or CMYK result.

Is HEX to CMYK conversion exact for printing?

RGB and HEX describe screen light, while CMYK describes ink. CMYK results are useful approximations and do not guarantee printed color output.