# font-face at-rule

The `@font-face` at-rule is intended to display text on web pages loaded from a remote server or from the user's local computer. If the rule declares the `local` function, then the font search will be carried out primarily on this local computer. If the font is not found, the font specified in the `url` function will be used.

## Syntax

`@font-face { font name; font search source; }`

## Example

Let's find a font on our local computer:

`<body> This is Montserrat SemiBold. </body>` `@font-face { font-family: "Montserrat SemiBold"; src: local("Montserrat SemiBold"); } body { font-family: "Montserrat SemiBold"; } #elem { animation: anim 3s infinite; border: 1px solid black; width: 50px; height: 50px; }`

:

## Example

Now let’s specify the url of the remote server to search for the font:

`<body> This is Bitstream Vera Serif Bold. </body>` `@font-face { font-family: "Bitstream Vera Serif Bold"; src: url("https://mdn.github.io/css-examples/web-fonts/VeraSeBd.ttf"); } body { font-family: "Bitstream Vera Serif Bold", serif; } #elem { animation: anim 3s infinite; border: 1px solid black; width: 50px; height: 50px; }`

:

← →
↑
en ru