Colors in HTML

Colors in HTML with Examples

In this article, I am going to discuss Colors in HTML with Examples. Please read our previous article where we discussed Favicon in HTML with Examples. At the end of this article, you will learn everything about HTML Colors with Examples.

Colors in HTML

HTML colors can be defined using RGB, HEX, HSL, RGBA, or HSLA values, as well as preset color names.

Background Color

Background Color property is used in Html to set background for elements.

Syntax: style=” background-color : value; “

Background Color Example in HTML
<!DOCTYPE html>
<html>
<body>
<br>
<h1 style="background-color:DodgerBlue;color:white;padding:10px;">Dot Net Tutorials</h1>

<p style="background-color:Tomato;color:white;padding:10px;">
This dot net tutorial website for those who want to learn Java, Dot Net, C, C++, Data Structure, Databases like SQL Server, Oracle, MySQL, MongoDb, MEAN, MERN, UI technologies like Angular, Node, React, HTML CSS, JavaScript,  and Bootstrap.
</p>

</body>
</html>

When you run the above HTML code, you will get the following output in the browser.

Background Color Example in HTML

Text Color in HTML

The color property is used in Html to set text color for elements.

Syntax: style=” color : value; “

Text Color Example in HTML
<!DOCTYPE html>
<html>
<body>
<br>
<h3 style="color:Tomato;">Dot Net Tutorials</h3>

<p style="color:slateblue;">This dot net tutorial website for those who want to learn Java, Dot Net, C, C++, Data Structure, Databases like SQL Server, Oracle, MySQL, MongoDb, MEAN, MERN, UI technologies like Angular, Node, React, HTML CSS, JavaScript,  and Bootstrap.</p>

</body>
</html>

When you run the above HTML code, you will get the following output in the browser.

Text Color Example in HTML

Border Color in HTML

The border property is used in Html to define borders around & set the border color for elements.

Syntax: style=” border : 2px solid Violet; “

Border Color Example in HTML:
<!DOCTYPE html>
<html>
<body>
<br>
<h1 style="border: 2px solid Tomato;">Dot Net Tutorials</h1>

<h1 style="border: 2px solid DodgerBlue;">Dot Net Tutorials</h1>

<h1 style="border: 2px solid Violet;">Dot Net Tutorials</h1>

</body>
</html>

When you run the above HTML code, you will get the following output in the browser.

Border Color Example in HTML

In the next article, I am going to discuss RGB in HTML with Examples. Here, in this article, I try to explain Colors in HTML with Examples and I hope you enjoy this HTML Colors with Examples article.

Leave a Reply

Your email address will not be published.