RGB to Hex Converter

The three most often used color definition formats are: RGB, HEX, and HSL:

RGB (Red, Green, Blue):

RGB color values represent a color by specifying the intensity of its red, green, and blue components. Each component is an integer value ranging from 0 to 255, where 0 indicates no intensity, and 255 represents the maximum intensity. The syntax for RGB is rgb(red, green, blue).

HEX (Hexadecimal):

HEX color values use a six-character code to represent the red, green, and blue components. Each pair of characters corresponds to one of the color components. The characters range from 0-9 and A-F, where 00 is the minimum intensity, and FF is the maximum. The syntax for HEX is #RRGGBB.

HSL (Hue, Saturation, Lightness):

HSL color values represent a color based on its hue, saturation, and lightness. Hue is the type of color (0 to 360 degrees on the color wheel), saturation is the intensity (0% to 100%), and lightness is the brightness (0% to 100%). The syntax for HSL is hsl(hue, saturation, lightness).

Color Value Conversion

RGB to HEX

To convert an RGB color to HEX, follow these steps:

• Convert each RGB component to its hexadecimal equivalent.
• Place the resulting hexadecimal values together.
• Prepend the resulting number with ‘#’.

RGB to HSL

Converting RGB to HSL involves normalizing the RGB values (in the range between 0 and 1) and using the following formulas to calculate the equivalent HSL values:

Calculate Lightness (L): 

L = ( max(r,g,b) + min(r,g,b) ) /2

Calculate Saturation (S):

• if L = 0 or L = 1:  S = 0   
• if L < 0.5:  S = ( max(r,g,b) − min(r,g,b ) / ( max(r,g,b) + min(r,g,b )
• if L >= 0.5:  S = ( max(r,g,b) − min(r,g,b ) / ( 2 - max(r,g,b) - min(r,g,b )

Calculate Hue (H):

The hue is determined based on the following conditions:

• if  max(r,g,b) - min(r,g,b) = 0: H =  0 
• if red is the maximum component (max(r,g,b) = r), calculate the hue using the formula: 
  H =  60 × ((g − b) / (max(r,g,b) - min(r,g,b)) mod 360
• if green is the maximum component (max(r,g,b)=g), calculate the hue using the formula:
  H =  60 × ((b − r) / (max(r,g,b) - min(r,g,b) + 2 ) mod 360
• if blue is the maximum component (max(r,g,b)=b), calculate the hue using the formula:
  H =  60 × ((r − g) / (max(r,g,b) - min(r,g,b) + 4 ) mod 360

Note that H is in the range from 0 to 360, S is in the range form 0 to 1, and L is in the range from 0 to 1.

While you can perform this conversion manually, it can be done more easily with a color picker tool or an online converter, like this one.