The new 'font-face' directive allowed, for the first time, the inclusion of fonts outside the web-safe font range, and displaying text in almost any font you could choose. Here's an example of font-face in action in a stylesheet:
url('Sansation_Light.eot'); /* IE9 */
First you'll notice the unusual '@' qualifier in front of the directive. In basic terms, you choose a font-family and give it a stylesheet name (in the case above, 'myFirstFont'), then point this font name to the actual font files you have stored on your server (or referred to via a URL). The 'src' directive points to the actual font file name. You can use .ttf, .eot, .svg and .wot format font files, and should specify as many formats as you have to ensure at least one of them can be rendered in your browser.
Once you've set up your font-face clause, you can then go on to use the font in your stylesheet as if it were a web-safe font eg.:
A fantastic resource of web fonts has been made available by Google,
or you can generate your own font files (with accompanying .css) at
Note that your fonts should be licenced to do the conversion. Many commerical fonts are not licenced, and some will not pass the conversion process because of this.