HTML Font Tag: Legacy and Modern CSS
<font> in new HTML. The element is deprecated. Use CSS for text color, size and typeface.The historical <font> element controlled color, face and size. Browsers may still render it for compatibility, but modern HTML separates document meaning from visual presentation.
Historical font tag syntax Top ↑
<font color="red" face="Arial" size="4">Legacy styled text</font>Modern CSS replacement Top ↑
<p class="notice">Modern styled text</p>
.notice {
color: #b00020;
font-family: Arial, Helvetica, sans-serif;
font-size: 1.125rem;
}Choosing font-size units Top ↑
rem is useful for scalable site typography, em is relative to the current element context, percentages are relative, and pixels represent CSS pixels. Absolute-size keywords such as small and large are also valid CSS values.
Readable typography Top ↑
Avoid fixing text so small that users cannot comfortably read it. Allow browser zoom and user text preferences to work, and use sufficient color contrast.
Related Tutorials Top ↑
Frequently Asked Questions Top ↑
Is the HTML font tag deprecated?
Yes. Keep it only when explaining or maintaining legacy markup; use CSS in new work.
What replaces font color?
Use the CSS color property.
What replaces font face?
Use CSS font-family.
What replaces font size?
Use CSS font-size.
Will old font tags still render?
Many browsers still support them for compatibility, but that does not make them appropriate for new HTML.
Subhendu Mohapatra
Author & Instructor at plus2net
I write and maintain practical tutorials on Python, PHP, SQL, JavaScript, HTML, jQuery, and web development at plus2net. The tutorials focus on clear explanations, working examples, and code that readers can test and adapt while learning.
