Css convert hex to rgb

Question

Enter 6 digits hex color code and press the Convert button:

Nội dung chính Show

Hex to RGB color table
Hex to RGB conversion
Write how to improve this page
What does this RGB to Hex converter do?
Convert a Hex value to RGB
Explore Some Colors
Any Hex Form Modular Approach
How do I convert hex to RGB?
What is the hex code equivalent of RGB?
Can I use hex in RGBA?
How do I get the RGB color code in HTML?

RGB to hex converter ►

Hex to RGB color table

Color name	Hex	(R,G,B)
Black	#000000	(0,0,0)
White	#FFFFFF	(255,255,255)
Red	#FF0000	(255,0,0)
Lime	#00FF00	(0,255,0)
Blue	#0000FF	(0,0,255)
Yellow	#FFFF00	(255,255,0)
Cyan	#00FFFF	(0,255,255)
Magenta	#FF00FF	(255,0,255)
Silver	#C0C0C0	(192,192,192)
Gray	#808080	(128,128,128)
Maroon	#800000	(128,0,0)
Olive	#808000	(128,128,0)
Green	#008000	(0,128,0)
Purple	#800080	(128,0,128)
Teal	#008080	(0,128,128)
Navy	#000080	(0,0,128)

Hex to RGB conversion

Get the 2 left digits of the hex color code and convert to decimal value to get the red color level.
Get the 2 middle digits of the hex color code and convert to decimal value to get the green color level.
Get the 2 right digits of the hex color code and convert to decimal value to get the blue color level.

Example #1

Convert red hex color code FF0000 to RGB color:

Hex = FF0000

So the RGB colors are:

R = FF16 = 25510

G = 0016 = 010

B = 0016 = 010

Or

RGB = (255, 0, 0)

Example #2

Convert gold hex color code FFD700 to RGB color:

Hex = FFD700

So the RGB colors are:

R = FF16 = 25510

G = D716 = 21510

B = 0016 = 010

Or

RGB = (255, 215, 0)

RGB to hex conversion ►

Write how to improve this page

Give function hex code (e.g. #eeeeee), returns array of RGB values.

function hex2rgb( $colour ) {
        if ( $colour[0] == '#' ) {
                $colour = substr( $colour, 1 );
        }
        if ( strlen( $colour ) == 6 ) {
                list( $r, $g, $b ) = array( $colour[0] . $colour[1], $colour[2] . $colour[3], $colour[4] . $colour[5] );
        } elseif ( strlen( $colour ) == 3 ) {
                list( $r, $g, $b ) = array( $colour[0] . $colour[0], $colour[1] . $colour[1], $colour[2] . $colour[2] );
        } else {
                return false;
        }
        $r = hexdec( $r );
        $g = hexdec( $g );
        $b = hexdec( $b );
        return array( 'red' => $r, 'green' => $g, 'blue' => $b );
}

What does this RGB to Hex converter do?

It takes input in the form of values for Red, Green and Blue ranging from 0 to 255 and then converts those values to a hexadecimal string that can be used to specify color in html/css code. Photo editing software usually represents color in RGB and therefore if you would like to use the colors you use in your photo editing software as the background of your html element then you will have to get the hexadecimal representation of the RGB values. This tool allows you to get those values.

Try our new color exploring tool.

Convert a Hex value to RGB

Perhaps you have seen a hex code on a web page and would like to use that color in your photo editing software. In that case you will need the RGB values if your photo editing software does not support hex values.

Click here to use the Hex to RGB converter page.

Explore Some Colors

W3Schools is optimized for learning and training. Examples might be simplified to improve reading and learning. Tutorials, references, and examples are constantly reviewed to avoid errors, but we cannot warrant full correctness of all content. While using W3Schools, you agree to have read and accepted our terms of use, cookie and privacy policy.

Any Hex Form Modular Approach

The main challenge is that as of 2018 there are a few forms of HEX. The 6 char traditional form, the 3 char shorten form, and a new 4 and 8 char form that includes alpha. The following function can handle any HEX form.

const isValidHex = (hex) => /^#([A-Fa-f0-9]{3,4}){1,2}$/.test(hex)

const getChunksFromString = (st, chunkSize) => st.match(new RegExp(`.{${chunkSize}}`, "g"))

const convertHexUnitTo256 = (hexStr) => parseInt(hexStr.repeat(2 / hexStr.length), 16)

const getAlphafloat = (a, alpha) => {
    if (typeof a !== "undefined") {return a / 255}
    if ((typeof alpha != "number") || alpha <0 || alpha >1){
      return 1
    }
    return alpha
}

export const hexToRGBA = (hex, alpha) => {
    if (!isValidHex(hex)) {throw new Error("Invalid HEX")}
    const chunkSize = Math.floor((hex.length - 1) / 3)
    const hexArr = getChunksFromString(hex.slice(1), chunkSize)
    const [r, g, b, a] = hexArr.map(convertHexUnitTo256)
    return `rgba(${r}, ${g}, ${b}, ${getAlphafloat(a, alpha)})`
}

Alpha could be provided to the function in the following ways:

As part of a 4, or 8 form HEX .
As a second parameter between 0-1,

OutPut

    const c1 = "#f80"
    const c2 = "#f808"
    const c3 = "#0088ff"
    const c4 = "#0088ff88"
    const c5 = "#98736"

    console.log(hexToRGBA(c1))   //  rgba(255, 136, 0, 1)
    console.log(hexToRGBA(c2))   //  rgba(255, 136, 0, 0.53125)
    console.log(hexToRGBA(c3))   //  rgba(0, 136, 255, 1)
    console.log(hexToRGBA(c4))   //  rgba(0, 136, 255, 0.53125)
    console.log(hexToRGBA(c5))   //  Uncaught Error: Invalid HEX

    console.log(hexToRGBA(c1, 0.5))   //  rgba(255, 136, 0, 0.5)
    console.log(hexToRGBA(c3, 0.5))   //  rgba(0, 136, 255, 0.5)

How do I convert hex to RGB?

Hex to RGB conversion Get the 2 left digits of the hex color code and convert to decimal value to get the red color level. Get the 2 middle digits of the hex color code and convert to decimal value to get the green color level.

What is the hex code equivalent of RGB?

RGB to Hex color table.

Can I use hex in RGBA?

In CSS, there are several formats for colors that can be used. Common ones include hex (hexadecimal) codes, RGB (red, green, blue), RGBA (red, green, blue, alpha), and HSL (hue, saturation, lightness).

How do I get the RGB color code in HTML?

#0000FF – This HTML color code shows just blue and no red and green. #FFFF00 – This HTML color code is a mixture of red and green colors defined as yellow. ... HTML..

programming css RGB to HSL Hex to color Converting Colors Color to RGB RGB color

Css convert hex to rgb

Hex to RGB color table

Hex to RGB conversion

Example #1

Example #2

See also

Write how to improve this page

What does this RGB to Hex converter do?

Convert a Hex value to RGB

Explore Some Colors

Any Hex Form Modular Approach

How do I convert hex to RGB?

What is the hex code equivalent of RGB?

Can I use hex in RGBA?

How do I get the RGB color code in HTML?

Bài Viết Liên Quan

Quảng Cáo

Có thể bạn quan tâm

Toplist được quan tâm

Quảng cáo

Xem Nhiều

Quảng cáo

Chúng tôi

Điều khoản

Trợ giúp

Mạng xã hội