CSS How to use Custom Fonts

CSS3 allows the use of custom fonts trough the @font-face rule. They are really easy to add and the syntax looks like this:

@font-face {
    font-family: someFont;
    src: url('path/font.ttf');
}
Code language: CSS (css)

This declares a font for use within your web page. An example would be:

@font-face {
    font-family: CODEBold;
    src: url('../fonts/CODEBold.otf');
}
Code language: CSS (css)

Now to apply the custom font to your text you can use the font-family property:

<h1 style="font-family: CODEBold">Start Debugging</h1>
Code language: HTML, XML (xml)

A great source for custom fonts would be dafont.com
Check out a demo here: Custom Fonts Demo