HTML Color Codes

You can add color to your website using HTML or CSS. It’s much easier to use CSS as can be seen from the example below:

Coloring a text using HTML attribute:
<p style="color:red" 
    I love coding>
</p>
 Coloring a text using CSS:
<style>
    p {color: red;}
</style>

We can easily use names to display the colors on the web page but there are a lot of colors and we cannot remember all of them. So, we use color codes. There are various color codes for different color models.

RGB COLOR CODES:

There are three values in RGB color codes. First one represents the amount of Red color, second and third give the amount of Green and Blue colors. The lowest value a color can have is 0 and the highest 255. So now we have the choice of taking 256 values for each shade of Red, Green, and Blue. The possible color combinations that we have now is 16,777,216 which is roughly 16 million color combinations! The values (255, 255, 255) represent white and (0, 0, 0) represents black. We write RGB color codes starting with rgb.

<p style="color: rgb(255, 0, 0)"
    I love coding>
</p>
<style>
    p {color: rgb(255, 0, 0);}
</style>
HEX COLOR CODES:

It’s a short form of the RGB color codes. We use hexadecimal values instead of decimal. You can convert a decimal value into hexadecimal by dividing it with 16. So the lowest value a color can have is 0 and the highest is FF (or 255 in decimal). We write the hex color codes starting with # (hash).

<p style="color: #FF0000"
    I love coding> 
</p>
<style>
    p {color: #FF0000;}
</style>

There are other color models including RGB like, HSL, HSU and CMYK. There are various types of color codes for each of them but Hexadecimal color codes are the standard color codes for all web browsers. If you check the source code of any website you will definitely see the hex codes. You can also right-click on any element in a web page to Inspect it to see the style and codes behind it. Here is an example, which is showing #FFFFFF or rgb(255, 255, 255) as the background color of the search bar which is white and the text colors as #4A4A4A or rgb(74, 74, 74), which are black.

Ecosia Browser
Ecosia Browser

The valid hex codes that color should have are basically decided by the hexadecimal conversion of each decimal value. In decimal, we have 10 base elements 0-9 whereas in hex we have 16 basic elements 0-9 and A to F. So a color code with value #X4FF12 is not valid because X is not an element of the hexadecimal number system.

You can use an HTML color picker to get the desired RGB or Hex color code.

0
0

Related Posts