Colors in HTML with Example

HTML colors are used to make the text and backgrounds of the webpage look more attractive by using a regular and different combination of colors together.

Colors in HTML are done by using <body> tags and also by using the background color Attribute for specific text. Let us understand HTML Colors in detail.

HTML Colors Formats

HTML Colors are predefined with specific types of information given to them. It helps to change the tone of the webpage by adding a variety of color combinations which makes the website look clean and catchy The three major ways to find and use the  Colors in HTML codes on the webpage.  for a better understanding of the colors, we can use online extensions from different OS showing the contrast of the color for eg: COLOR PICKER II.

We can use the HTML in Website as Below: link https://codedec.com/

Types of HTML Color code

1. Example of Regular color names:  Colors can be used in  HTML programs by specifying their Basic names. all-new generation web browsers support the normal color range.

<!DOCTYPE html>
<html>
<body>
<h1 style="background-color:Orange;">hello learner</h1>
<h1 style="background-color:MediumSeaGreen;">welcome to codedec</h1>
<h1 style="background-color:Violet;"> fun with</h1>
<h1 style="background-color:Red;">regular colors</h1>
</body>
</html>

output:

2. Example of hexadecimal color Value: It is a six-digit code that starts with hash sign #. It has a combination of two digits of Red, Green, and Blue.  The intensity of the color is determined between 00 and FF  range of integer value.

<!DOCTYPE html>
<html>
<body>
<h1 style="background-color:#3cb371;">#3cb371</h1>
<h1 style="background-color:#800000;">#800000</h1>
<h1 style="background-color:#808000;">#6a5acd</h1>

</body>
</html>

 

output:

3. Example of RGB color Value:  It is a three-digit code under parenthesis with rgb (). It is a combination of one digit for each Red, Green, and Blue. It gives access to a broad array of colors, the intensity of the color in value can be between 0 to 255 and in percentage from 0% to 100%.

<!DOCTYPE html>
<html>
<body>

<h1 style="background-color:rgb(0, 0, 255);">welcome to codedec</h1>
<h1 style="background-color:rgb(60, 179, 113);">fun with  </h1>
<h1 style="background-color:rgb(238, 130, 238);">COLORS</h1>

</body>
</html>

OUTPUT: