RGB to Hex Converter icon

Rgb to Hex Color Code Converter

Convert rgb to hex, hex to rgb and rgb to hsv, hsl and cmyk



RGB to Hex Converter


HEX CODE: #ffd700

copy icon

COLOUR RGB: 255, 215, 0

HSV: hsv(51, 100%, 100%)

HSL: hsl(51, 100%, 50%)

CMYK: cmyk(0%, 15.69%, 100%, 0%)

What is RGB and Hex?

Formula Icon
  • RGB and HEX are color models and they are used to represent colors in digital space.
  • RGB stands for Red, Green, and Blue and each of the component is represented by a number ranging from 0 to 255.
    Example of an RGB color code for red is 255,0,0
    Here, Red component has a value of 255, Green and Blue components have value of 0.
  • RGB color code values are based on the decimal number system. The decimal number system is a Base-10 system which uses numbers from 0 – 9
  • HEX stands for hexadecimal and the colors are represented in hex format with 2 digits per color. The first two digits of a HEX color code represent the red component, the next two digits represent the green component and the last two digits represent the blue component.
  • Hex color code values are based on the hexadecimal number system. The hexadecimal number system is a Base-16 system which usess the numbers 0 – 9 and the letters A – F
  • Example of a hex code is #fff00a which is a shade of yellow color
    # is a prefix used for an hexadecimal color code.
    ff - red component
    f0 - green component
    0a - blue component When these are combined, the resultant color is yellow.
    A prefix 0x is used to indicated a hexadecimal number but for hex color code, use # as prefix
  • Both HEX and RGB can represent upto 16 million colors. As R, G and B each can be expressed with a color value in the range 0 to 255, the number of unique colors possible is 255 ^ 3 which is 16 1/2 million
  • Both RGB and HEX color schemes are Additive. An Additive color system goes from lightness to darkness. When all 3 red, green and white colors are combined, it is white (#FFFFFF).
    When all 3 colors are reduced, it becomes darker and darker till we get black color (#000000)
  • RGB is the color format used by monitors, digital displays and especially for printable output.
  • Hex is typically used in stylesheets (css) in html code. It is commonly used in web applications.

How to convert RGB To Hex?

  • Divide each of the R, G and B values separately by 16.
    For each of them, the Quotient is the 1st part of hex and the Remainder is the 2nd part of hex.
    Convert the decimal numbers to hexadecimal number scale which uses 0-9 and A-F (for values 10 to 15) to determine the hex code

  • let's convert RGB value of 55,44,255 representing a shade of blue to hex code

  • Take the R value first and divide by 16
    R/16 = 55/16
    Quotient = 3
    Remainder = 7
    The number 37 is same in hexadecimal.
    R part is '37'

  • Take the G Value and divide by 16
    44/16 = Quotient = 2, Remainder = 12
    2 remains 2 in hexa, 12 in hexadecimal is 'C'.
    Combining the two values we get G as '2C'.

  • Now, take the B value and divide by 16
    255/16 = Quotient = 15, Remainder = 15
    15 in hexadecimal is 'F'
    Combining the two numbers we get B as 'FF'

  • Combine RGB codes to get final Hexadecimal color code
    The hex color code is #372CFF

How to Convert Hex to RGB?

  • To convert hex to rgb, separate out each of the hex components for RGB.

  • 73 is the hex part of R, ff is the hex part of G and 21 is the hex part of B

  • Consider a hex value of #73ff21 to be converted to RGB.

  • As first step, convert the A to F to its decimal value. Then,
    For R value in RGB = 7 * 16 1 + 3 = 112 + 3 = 115

  • G value = f * 16 + f = 15 * 16 + 15 = 255

  • B value = 2 * 16 + 1 = 33

  • Combining all the values hex #73ff21 is RGB(115,255,33)
    Similarly, If the hex value is #ddd it means it is same as 0d0d0d so RGB = 13, 13, 13

Note: You can also refer our Hex to Decimal Converter for converting between hexadecimal and decimal

How to Calculate Hue from RGB?

  • Hue is a value that represents an angle in degrees which represents a color in a color wheel.

  • To convert RGB to Hue, divide the R, G and B values by 255. This will reduce them to a range between 0 to 1.

  • Determine the max of R, G and B and the minimum of the R, G and B values.

  • If the min and max are of same value, then it's grey and Hue is equal to 0

  • If max is 'R' or red component, then
    Hue = (G - B) / (Max - Min)
    If max is 'G' or Green component, then
    Hue = 2 + (B - R) / (Max - Min)
    If max is 'B' or Blue component, then
    Hue = 4 + (R - G) / (Max - Min)

  • Convert the Hue value to degrees
    Hue = Hue * 60
    If hue is -ve, then add 360 degrees to it,
    hue = hue + 360

How to Calculate Luminance or Brightness from RGB?

  • Brightness or Luminance is the amount of White color added to hue. The more the white shade, the brighter it is and vice-versa.

  • 0% brightness means dark. 100% brightness means light.

  • Similar to above section, divide RGB values by 255 and find max and min values..

  • Luminosity or Lightness = Max - Min / 2. Multiply by 100 to get the value in Percentage.

  • For eg, R G B value for red is 255, 0, 0. Converting to 0 to 1 scale, we get 255/255,0/255, 0/255 = 1,0,0
    max = 1, min = 0
    Luminosity or lightness = 1+ 0 / 2 = 0.5 * 100 = 50%

  • Consider RGB value as 127,50,0. This becomes 0.5,0.2,0
    min = 0, max =0.5
    Luminosity = 0.5 + 0 /2 = 0.25 * 100 = 25%

How to Calculate Saturation from RGB?

  • Saturation is the intensity or purity of the color. Saturation is in Percentage (%).
    0% saturation means shades of grey, 100% is pure color and not mixed with any.

  • To convert RBG to Saturation value, use the max and min value computed from previous hue calculation

  • If Max and Min are same, then Saturation is 0%

  • If they are different, find the average of Max and Min value which is the luminosity value
    Luminosity - Avg = Min + Max / 2

  • If lightness is less than 0.5,
    Saturation = (max-min)/(max+min)
    If lightness is greater than 0.5,
    Saturation = (max-min)/(2-max-min)

  • For example, if RGB is 255,0,0 , then Saturation is 100%. If RGB is 100,100,100, then it's mixed color and Saturation is 0% For RGB 253,175, 223 (pink color), Saturation is 31%.

RGB, Hex and CMYK Color Code Table

Conversion icon
Color Codes Hex code colour RGB color code CMYK Preview
Red color code #FF0000 RGB(255, 0, 0) cmyk(0%,100%,100%,0%)
Pink color code #FFC0CB RGB(255, 192, 203) cmyk(0%,25%,20%,0%)
Orange color code #FFA500 RGB(255, 165, 0) cmyk(0%,35%,100%,0%)
Yellow color code #FFFF00 RGB(255, 255, 0) cmyk(0%,0%,100%,0%)
Green color code #008000 RGB(0, 128, 0) cmyk(100%,0%,100%,50%)
Blue color code #0000FF RGB(0, 0, 255) cmyk(100%,100%,0%,0%)
Brown color code #A52A2A RGB(165, 42, 42) cmyk(0%,75%,75%,35%)
White color code #FFFFFF RGB(255, 255, 255) cmyk(0%,0%,0%,0%)
Gray color code #808080 RGB(128, 128, 128) cmyk(0%,0%,0%,50%)
Gold color code #FFD700 RGB(255, 215, 0) cmyk(0%,16%,100%,0%)
Purple color code #800080 RGB(128, 0, 128) cmyk(0%,100%,0%,50%)
Orange color code #FFA500 RGB(255, 165, 0) cmyk(0%,35%,100%,0%)
Sage Green color code #B2AC88 RGB(178, 172, 136) cmyk(0%,3%,24%,30%)
Teal color code #008080 RGB(0, 128, 128) cmyk(100%,0%,0%,50%)
Lavender color code #E6E6FA RGB(230, 230, 250) cmyk(8%,8%,0%,2%)
Light Blue color code #ADD8E6 RGB(173, 216, 230) cmyk(25%,6%,0%,10%)
Beige color code #F5F5DC RGB(245, 245, 220) cmyk(0%,0%,10%,4%)
Hot Pink color code #FF69B4 RGB(255, 105, 180) cmyk(0%,59%,29%,0%)
Cyan color code #00FFFF RGB(0, 255, 255) cmyk(100%,0%,0%,0%)
Maroon color code #800000 RGB(128, 0, 0) cmyk(0%,100%,100%,50%)
Navy Blue color code #000080 RGB(0, 0, 128) cmyk(100%,100%,0%,50%)
Royal Blue color code #4169E1 RGB(65, 105, 225) cmyk(71%,53%,0%,12%)
Cream color code #FFFDD0 RGB(255, 253, 208) cmyk(0%,1%,18%,0%)
Dark Blue color code #00008B RGB(0, 0, 139) cmyk(100%,100%,0%,45%)
Magenta color code #8B008B RGB(139, 0, 139) cmyk(0%,100%,0%,45%)
Peach color code #FFDAB9 RGB(255, 218, 185) cmyk(0%,15%,27%,0%)
Dark Green color code #006400 RGB(0, 100, 0) cmyk(100%,0%,100%,61%)
Turquoise color code #40E0D0 RGB(64, 224, 208) cmyk(71%,0%7%,12%)
Coral color code #FF7F50 RGB(255, 127, 80) cmyk(0%,50%,69%,0%)
Black color code #000000 RGB(0, 0, 0) cmyk(0%,0%,0%,100%)
Lime Green color code #32CD32 RGB(50, 205, 50) cmyk(76%,0%,76%,20%)
Rose Gold color code #b76e79 RGB(183,110,121) cmyk(0%,40%,34%,28%)
Emerald color code #50C878 RGB(80, 200, 120) cmyk(60%,0%,40%,22%)
Bronze color code #CD7F32 RGB(205,127,50) cmyk(0%,38%,76%,20%)

FAQ on Color Models

FAQ icon

  • HSL : H - Hue, S - Saturation, L - Lightness. Hue means color (combination of Red, Blue and Green). Saturation refers to the intensity and purity of the color.
    100% means the color or hue is pure not mixed with other shades, 0% means it's more of grey and not pure. Lightness is same as Brightness which is amount of white / black color added to it.
    100% white is one end of lightness and 100% black is the other end representing 0 brightness.
    Hue is value between 0 to 255 (0xFF), Saturation and Value are in %.

  • HSL : H - Hue, S - Saturation, V - Value. Hue means color (the combination of Red, Blue and Green).
    Saturation refers to the intensity and purity of it. As saturation increases it tends towards white shades and 100% means the color is white.
    Value is the brightness of a color. light color are also referred as tints and dark color are referred as shades. It does not go to white but from black to the chosen hue.
    Hue is value between 0 to 255 (0xFF), Saturation and Value are in %.

  • HSB is hue, saturation and brightness. It is same as HSV.

  • HSB and HSV are same. HSB is Hue Saturation Brightness. HSL and HSB/HSV are different.

  • Hue is same in HSL and HSV but saturation and light/bright behavior is different in both. Saturation indicates intensity in both.
    In HSL , they grey component increases and becomes max as 100% but it's not white. In HSV, 100% saturation becomes white.
    The Lightness / Brightness in HSV goes all the way from black (0%) to white (100%). In HSV, it goes from black to selected hue.
    So the range of % in saturation and lightness/brightness values vary.

  • These color models are mainly used in computer software like image processing/editing tools, image scraping , facial recognition, computer graphic applications.
    RGB is a simple visual color model as perceived by the human eye.
    HSV, HSL are used by computer systems to process color information with intensity, lightness and other parameters and create a visual model that matches that of human visual processing.

  • CMYK is another color model and industry standard for color printing. CMYK Stands for Cyan, Magenta, Yellow and Key(Black).

  • RGB - when all colors are combined, it is white in RGB and absence of color is black.
    CMYK - when all colors are combined it is black and absence of color is white.
    Screens, Televisions and monitors all use RGB color model. Wherever visual medium is based on transmitted 'light', RGB is preferred.
    CMYK is mainly used in color printing.

  • The different colors are combined in various ways to produce new colors going from darkness to lightness.
    It starts with Black which is rgb(0,0,0) and as the colors are added in different intensity, it produces new colors of increasing values
    It finally becomes White which is ryb (255,255,255). RGB is an additive color system and creates illumining colors on screen using transmitted light.

  • It starts with White (bg such as paper) and then when subtractive colors are mixed with it, it becomes darker and darker till it is black.
    CMYK is a subtractive color system where adding Cyan, Magenta and Yellow to white in equal measures makes it black.
    Black is the 'K' part of CMYK also known as the key color. This is based on reflective light from a white medium.

  • Brightness is absolute value like 0%, 25%, 60%, 100% and it's independent of the observer.
    Lightness is perceived view of the brightness. It depends on the observer.
    Luminosity is the light emitted by an object. It depends on the surface area, object type and a calculated value.