Open In App

CSS 8 Digit Hex Color

Last Updated : 09 Jun, 2023
Improve
Improve
Like Article
Like
Save
Share
Report

The Eight Digit Hex color is as simple as Six Digit Hex color it contains 8 digits rather than six, it is used to define the color of your elements with the CSS. It has a prefixed hash(#) value before the digits like six-digit hex code. The difference between 6 and 8-digit hex codes is, that 2 extra characters define the alpha channel as the name suggests in the 8 digit hex color. The last two digits will define that the color will how much transparent or opaque. If the last two digit is 00 then that will be fully transparent and if that is FF then it will be fully opaque. 

Syntax:

#RRGGBBAA

Note: The first six characters represent the RGB color as Six digit hex color code. The last two represent the alpha channel. 

Example 1: In this example, we are using CSS 8 Digit Hex Color property.

html




<!DOCTYPE html>
<html>
<head>
    <title>CSS 8 Digit Hex Color</title>
    <style>
        body {
            background-color: #666600;
        }
 
        h1 {
            color: green;
        }
 
        article {
            background-color: #FFFFFF44;
            border: 5px solid green;
            margin: 15px;
            text-align: center;
        }
    </style>
</head>
 
<body>
    <article>
        <h1>GeeksforGeeks</h1>
    </article>
</body>
</html>


Output:

  

Example 2: here is another example of the above-explained property.

html




<!DOCTYPE html>
<html>
<head>
    <title>CSS 8 Digit Hex Color</title>
 
    <style>
        body {
            background-image: url(
            background-attachment: fixed;
            background-size: cover;
        }
 
        h2 {
            color: white;
        }
 
        article {
            background-color: #FFFFFF22;
            border: 2px solid green;
            background-position: center center;
            text-align: center;
        }
    </style>
</head>
 
<body>
    <article>
        <h2>GeeksforGeeks</h2>
    </article>
</body>
</html>


Output:

 



Similar Reads

CSS 4 Digit Hex Color
The Four Digit Hex Color can be used as the shorthand for the 8 Digit Hex Color. Four Digit Hex color can be used to define the color of your elements with CSS like 8 Digit Hex Color. There are 8 characters in 8-digit hex color that shrinks to 4 in 4-digit hex color but performance is the same as the color. In the 4 digits, the 4 characters are fol
2 min read
CSS 6 Digit Hex Color
The Six Digit Hex Color is very much popular to define colors in CSS because of the variation of multiple colors available in the 6-digit hex colors codes. There are Six characters followed by a hash(#) like #RRGGBB. The developer used the hex color codes it is hard enough to remember those to compare with color names like blue, green, cyan, brown,
2 min read
CSS | 3 Digit Hex Color
The 3 Digit Hex Color code is similar to 6 Digit Hex Color it's shorthand for 6 Digit Hex Color. In 3 Digit Hex Color shrink into single character those have twins in 6 Digit Hex Color the effect will be same but reduce the color variant. The 3 Digit Hex Color contains 3 character followed by hash(#) like #RGB. The #RGB define Red, Green and Blue c
1 min read
How to convert 3-digit color code to 6-digit color code using JavaScript ?
In this article, we are converting a three-digit color HEX code into a six-digit color HEX code using JavaScript. To solve this problem, first, we copy the individual digits and paste them at the consecutive positions. For example - #34E will be converted into #3344EE and #E90 will be converted into #EE9900. Steps to convert 3-digit color code to 6
2 min read
How to create Hex color generator using HTML CSS and JavaScript ?
Hex color is a six-digit code representing the amount of red, green, and blue that makes up the color. The hex color generator gives the hex code of the selected color. Approach: To select a color, we will use &lt;input type="color"&gt; which creates a color picker.Get the value returned by the color picker. (Color picker returns hex value)Set the
2 min read
How to get hex color value of RGB value ?
Given the RGB color value and the task is to get the Hex Code of that color using JavaScript. Approach 1: Call the convert() user-defined function and use RGB value as a parameter.Use the match() method to select the value of Red, Green, and Blue. The value of RGB is stored in the form of array.The hexCode() function call to convert the value of RG
2 min read
JavaScript Check if a string is a valid hex color representation
Given a hex color code and the task is to check whether the given hexCode is valid or not using JavaScript. We are going to discuss a few techniques. Approach: Valid hexcode contains the alphabets(A-F) and integers(0-9) and is of length 3 or 6.A RegExp is used to check whether the alphabets ranging between A and F, Integers from 0-9, and is of leng
1 min read
JavaScript Program to Generate Random Hex Codes of Color
What is hex code? A hex code is a six-digit, three-byte hexadecimal number used to represent colors in HTML, CSS, and SVG. The bytes represent the red, green, and blue components of the color. The hex codes are an integral part of HTML for web design and are a key way of representing colors digitally. Methods to be used for generating hex codes: Ma
1 min read
HTML Hex Color Codes
HTML Hex Color Codes consist of a hash (#) symbol followed by six characters, representing the intensity of red, green, and blue (RGB) in hexadecimal format. For instance, #RRGGBB, where each pair of characters denotes the RGB values. These codes are widely used to define colors in HTML and CSS. There are 1,67,77,216 different color possibilities.
4 min read
How to Drop fill color to change the image color using HTML and CSS ?
In this article, we are going to create a Drop fill color effect using HTML &amp; CSS in which the image get colored when we hover over it. It appears when you hover over the image a drop of color falls over the image which changes the color of the image from gray to colored. Approach: The following approach will be implemented to Drop fill color t
4 min read