You are here : cssCSS 3font-face

@font-face - CSS 3

With the @font-face rule, web designers do no longer have to use one of the "web-safe" fonts.

In the new @font-face rule you must first define a name for the font (e.g. myFirstFont), and then point to the font file.

Tip: Use lowercase letters for the font URL. Uppercase letters can give unexpected results in IE!

To use the font for an HTML element, refer to the name of the font (myFirstFont) through the font-family property:


  font-family: myFirstFont;


@font-face {
  font-family: myFirstFont;
  src: url(sansation_light.woff);

Output / Return Value


Alternatives / See Also

1. CSS3 font short hand property - font .