How to set font color in HTML?

HTML Web Development Front End Technology

We use the style attribute to set the font color in HTML. The style attribute specifies an inline style for an element, with the CSS color property. The attribute is used with the HTML <p> tag, with the CSS color property. HTML5 do not support the <font> tag, so the CSS style is used to add font color. The <font> tag deprecated in HTML5.

Syntax

<h1 style="color: azure">text…</h1>

Example

In the example below, we set the font color of the text inside the <p> tag.


<!DOCTYPE html>
<html>
<head>
   <title>HTML Font color</title>
</head>
<body>
   <h1>Products</h1>
   <p style="color:blue">This is demo content.</p>
</body>
</html>

Example

Following is the example program to set font color in HTML.


<!DOCTYPE html>
<html>
<head>
   <style>
      body {
         background-color: rgb(20,30, 1);
      }
   </style>
<h1 style="color: azure">HTML Articles</h1>
</head>
<body>
</body>
</html>

Example: Specifying internal style

We can also specify internal style for an element, with the CSS property color to set font color in HTML. Following is the example program for internal style sheet to set font color in HTML.


<!DOCTYPE html>
<html>
<head>
   <style>
      body {
         background-color: rgb(20,30, 1);
      }
      h1{
         color: cyan;
      }
   </style>
   <h1>HTML Articles</h1>
</head>
<body>
</body>
</html>

Lokesh Badavath

Updated on: 29-Aug-2023

148K+ Views

Kickstart Your Career

Get certified by completing the course

Get Started