Last Updated:

How to change text color in html

text color in html

There are several ways to change the color of text.

Using the font tag

The font tag has 3 attributes that change the text color, size, and font. The general formula looks like this:

<font color="color" face="font" size="size">Your text</font>

Special formatting cases look like this:

  • reduce the text <font size="-2"> the reduced text by 2 units</font>
  • increase the text <font size="+2"> increase the text by 2 units </font>
  •  change the color of the text <font color="red"> red text </font> or
    <font color="#FF0000"> red text </font>
  • change the size and color of text <font color="red" size="+3"> red text </font>
  • Change font <font face="Monotype Corsiva">Your text</font>

To change the color, you will need the Table of html color codes

Using the span tag

This method is preferable because it works in most cases and where the font tag is untenable.

  • You can change the text size:
    <span style="font-size: 25px;" >Your text</span>
    Your text
  • Change the color of the text
    <span style="color: blue;" >Your text</span>
    Your text
  • Change font:
    <span style="font-family: Monotype Corsiva;" >Your text</span>
    Your text
  • Change the font, color and size of the text at the same time:
    <span style="font-family: Monotype Corsiva; color: fuchsia; font-size: 25px;" >Your text</span>
    Your text
  1. To choose a font, use html fonts
  2. for color selection - HTML color table

Through CSS styles

The best way to specify text formatting is to apply css styles. Examples of "text" styles:

<html>
<head>
<style>
p {
color: #ccc000;
}
.primercss {
color: red
}
</style>
</head>
<body>
<p>An example of changing the color of a paragraph test in CSS</p>
<p class="primercss">An example of changing text color using a CSS class</p>
</body>
</html>