In this tutorial we will cover how to create HTML color codes for background and color names with change HTML color codes, using HEX color codes, RGB codes, HSL codes.

Html Color Codes for background


What are HTML Color Codes?


HTML color codes are must every coder fundamental skills to be designing the level in HTML. In HTML very important is how we arrange, text format, and How we are presented the article looks at the text, and how we are color for HTML code is an important design element for every website.

Hex Color Codes


HTML color codes are representing the colors red, green, and blue in hexadecimal codes (#RRGGBB). hexadecimal number system uses a combination of 16 digits characters and uses ten numbers in the decimal system 0 to 9 and alphabetic A through F. And the popular hex color codes are consist of six digits with each pair of Hex code representing red, green, blue.


# RR GG BB

How the HTML Color Codes works?


For Example, we want to design a page to create a green color using HTML color code #00FF00 that translates to 0 red, 255 lime green, and 0 blue in hexadecimal. 
 
The group of three hexadecimal numbers is called triplet and that triplet hexadecimal number code is used in HTML and the result is a lime green color. #00FF00 that the 0 represent red, FF is represents Green and 0 represent blue to create a lime green color. 
 
In hex color code value range from 00 which is lowest intensity and FF which represents to highest intensity. The color of black color the hex color code is #000000 and white #FFFFFF.


RGB Color Codes 

 
In the RGB color code in a decimal value starting from 0 to 255 and For example RGB (255,45,0) is Red color. and RGB white color represent RGB(255,255,255) and RGB black color is represent as RGB(0,0,0)
 
And the modern browsers are supporting the full of color spectrum that as 24-bit color and color picker to explore all the 16 million color possibilities.


HTML Common Color Codes in both Hex and RGB




Red

#FF0000
255, 0, 0

Gray

#808080
128, 128, 128

Blue

#0000FF
0, 0, 255

Teal

#008080
0, 128, 128

Purple

#800080
128, 0, 128

Navy

#000080
0, 0, 128

Aqua

#00FFFF
0, 255, 255

Olive

#808000
128, 128, 0

Maroon

#800000
128, 0, 0

Black

#800080
128, 0, 128

Silver

#C0C0C0
192, 192,192

Dark Gray

#363634
54, 54, 52







Example Codes in HTML


style.css


@import url('https://fonts.googleapis.com/css2?family=Sen:wght@700&display=swap');

body{width:650px;height:100vh;font-family: 'Sen', sans-serif;color:#fff;}
.h1tag
{
width:650px;
background-color:DodgerBlue;
text-align:center;
border-radius:5px;
}
.ptag
{
width:600px;
height:100px;
border-radius:5px;
background-color:IndianRed;
text-align:center;
padding:25px;
}

.h1tag1
{
width:650px;
text-align:center;
border-radius:5px;
background-color:rgb(46, 204, 113);
}
.ptag1
{
width:600px;
height:100px;
border-radius:5px;
background-color: #212f3d ;
text-align:center;
padding:25px;
}
.anchortag
{
border:2px solid  #212f3d ;
padding:20px;
text-align:center;
text-decoration:none;
color:#363636;
}
.anchortag:hover
{
background-color:#363636;
color:#fff;

}
  

HTML



<!DOCTYPE html>
<html>
<head>
</head>
<body>

<h1 class="h1tag">WHAT WE DO</h1>

<p class="ptag">
The group of three hexadecimal numbers is called triplet and that triplet hexadecimal number code is used in HTML and the result is a lime green color. #00FF00 that the 0 represent red, FF is represents Green and 0 represent blue to create a lime green color.
</p>
<br/>
<hr/>
<br/>
<h1 class="h1tag1">WE DESIGN</h1>

<p class="ptag1">
The group of three hexadecimal numbers is called triplet and that triplet hexadecimal number code is used in HTML and the result is a lime green color. #00FF00 that the 0 represent red, FF is represents Green and 0 represent blue to create a lime green color.
</p>
<br/>
<br/>
<center>
<a class="anchortag" href="#" >Let' Meet Us<span></span></a>
</center>
</body>
</html>
  

Finally, I hope you will learn color codes . If you like share the post on your friends and family. 
 
Thankyou...!
 

Result Output:


Html Color Codes for background

Post a Comment

Previous Post Next Post