The HTML <font> tag was used in older HTML versions to control the appearance of text by changing its color, size, and style, helping improve page readability and design.
- <font> allowed individual text formatting such as color, size, and font face in HTML4.
- <basefont> set a common font style, size, and color for all text on a web page.
Note: Font tag is not supported in HTML5.
<!DOCTYPE html>
<html>
<body>
<p>This is sample paragraph</p>
<font face="Arial" size="4" color="green">
This paragrap style by font tag
</font>
</body>
</html>
Syntax:
<font size="number" face="font_family" color="color_name|hex_number|rgb_number">Font Attributes
Font attributes define how text appears in an HTML document by controlling its size, style, and color, helping improve visual clarity and presentation.
1. Font size
The Font size attribute is used to adjust the size of the text in the HTML document using a font tag with the size attribute. The range of size of the font in HTML is from 1 to 7 and the default size is 3.
<!DOCTYPE html>
<html>
<body>
<!--HTML font size tag starts here-->
<font size="1">GeeksforGeeks!</font><br />
<font size="2">GeeksforGeeks!</font><br />
<font size="3">GeeksforGeeks!</font><br />
<font size="4">GeeksforGeeks!</font><br />
<font size="5">GeeksforGeeks!</font><br />
<font size="6">GeeksforGeeks!</font><br />
<font size="7">GeeksforGeeks!</font>
<!--HTML font size tag ends here-->
</body>
</html>
2. Font face
The font type is set using the face attribute of the <font> tag in an HTML document. The specified font must be available on the user’s system for it to be displayed correctly.
<!DOCTYPE html>
<html>
<body>
<font face="Times New Roman" size="6">
GeeksforGeeks!!
</font><br />
<font face="Verdana" size="6">
GeeksforGeeks!!
</font><br />
<font face="Comic sans MS" size=" 6">
GeeksforGeeks!!
</font><br />
<font face="WildWest" size="6">
GeeksforGeeks!!
</font><br />
<font face="Bedrock" size="6">
GeeksforGeeks!!
</font><br />
</body>
</html>
3. Font color
The Font color is used to set the text color using a font tag with the color attribute in an HTML document. Color can be specified either with its name or with its hex code.
<html>
<body>
<p>
<font color="green">G</font>
<font color="blue">e</font>
<font color="red">e</font>
<font color="yellow">k</font>
<font color="purple">s</font>
for
<font color="orange">G</font>
<font color="pink">e</font>
<font color="brown">e</font>
<font color="teal">k</font>
<font color="gray">s</font>
</p>
</body>
</html>