HTML Introduction

HTML font color Attribute

Last Updated : 11 Jul, 2025

The HTML font color attribute was historically used to specify text color within the <font> tag; although deprecated in HTML5 (used by less than 5% of modern websites), it's still useful to understand its legacy usage, while modern HTML relies on CSS for styling.

Syntax

<font color="color_name|hex_number|rgb_number">

Attribute Values:

Type	How It Works	Example Usage
Color Name	Pick from common color names to set the text color.	`"red"`
Hex Code	Use a 6-digit hex code to define specific colors.	`"#0000ff"`
RGB Code	Define colors using the RGB model with three values for red, green, and blue.	`"rgb(0, 153, 0)"`

Note: The <font> color attribute is not supported in HTML5. It is recommended to use CSS for setting text colors in modern development.

How to Change Text Color in HTML - Examples

Here are a few examples to help you understand how to set text color using the <font> color attribute:

Example 1: Setting Text Color Using the <font> Color Attribute

In this example, we set the text color of three different elements using the <font> color attribute. We demonstrate the use of a color name, a hex code, and an RGB code to style the text.

index.html

<!DOCTYPE html>
<html>
<head>
    <title>
        HTML | <font> color Attribute
    </title>
</head>
<body>
    <font size="6" face="white" color="green">
        GeeksforGeeks!
    </font>
    <br>
    <font size="6" face="green" color="#008000">
        GeeksforGeeks!
    </font>
    <br>
    <font size="6" color="rgb(148, 148, 0)">
        GeeksforGeeks!
    </font>
</body>
</html>

Output:

output

Although the font tag and its attributes are obsolete in HTML5, the above browsers still support them for backward compatibility. However, for modern web development, use CSS to style your text.

Example 2: Setting Text Color Using CSS Classes

In this example, we define CSS classes to set the text color using a color name, a hex code, and an RGB code. The classes are then applied to different <p> elements.

index.html

<!DOCTYPE html>
<html>
<head>
    <title>Font Color Example with CSS</title>
    <style>
        .green-text {
            color: green;
        }
        .blue-text {
            color: #00fff0;
        }
        .yellow-text {
            color: rgb(233,233, 143);
        }
    </style>
</head>
<body>
    <p class="green-text">
      	This text is green using CSS class.
  	</p>
    <p class="blue-text">
      	This text is blue using CSS class.
  	</p>
    <p class="yellow-text">
      	This text is yellow using CSS class.
  	</p>
</body>
</html>

Output:

browseroutput

While the <font> tag and its color attribute were useful in the past, modern HTML relies on CSS for styling. Understanding the historical context can help when dealing with legacy code, but using CSS is the best practice for current and future web development.

Note: While the browsers support the <font> tag for backward compatibility. CSS offers more flexibility, control, and is future-proof.

HTML font color Attribute

HTML Introduction

J

jit_t

Improve

Article Tags :

Similar Reads

HTML stands for HyperText Markup Language. It is the standard language used to create and structure content on the web. It tells the web browser how to display text, links, images, and other forms of multimedia on a webpage. HTML sets up the basic structure of a website, and then CSS and JavaScript