⚠ī¸ Warning ⚠ī¸ Deprecated Code! This video tutorial contains outdated code.
💡 If you wish to update it, any AI assistant will update the code for you in seconds.

Embed Custom Font HTML Tutorial Special Website Text

Published : November 17, 2014   •   Last Edited : November 24, 2025   •   Author : Adam Khoury
Learn to embed special fonts into your web design projects and pages to be sure all visitors will see the intended font style. The supplied code should get you started. The actual font files should be placed on your web server in order for all viewers to see your cool font. Microsoft Internet Explorer uses a font file type of .eot for embedding fonts into pages, while most other browsers use .ttf font files for embed purposes. The new woff font format is gaining popularity and works in most modern environments. 
<!DOCTYPE>
<html>
<head>
<style>
@font-face {
 font-family: aFont;
 src: url("aFont.eot"); /* For IE browsers */
}
@font-face {
 font-family: aFont;
 src: url("aFont.ttf"); /* For most other browsers */
}
.myFontClass {
	font-family: aFont, Arial, Helvetica, sans-serif;
	letter-spacing: 1px;
	color: #4D7731;
}
</style>
</head>
<body>
<h2 class="myFontClass">Custom Web Page Font</h2>
<p>Standard Web Page Font</p>
</body>
</html>
▲