--- title: Where to Get Fonts localeTitle: Onde obter fontes --- ## Onde obter fontes Os serviços de fontes on-line, como o Google Fonts ou o Font Squirrel, fornecem uma maneira fácil de usar fontes diferentes no seu site sem a necessidade de se preocupar se a pessoa que está visualizando o site terá ou não a fonte disponível no sistema. ### Fontes baixadas Sites como o Font Squirrel permitem que você baixe os arquivos de fontes escolhidos. Uma vez feito isso, você tem que enviá-los no servidor que hospeda seu site. Para usá-los, você precisa declará-los em sua folha de estilos CSS, o que significa dizer ao seu CSS que peça ao navegador do usuário para exibi-lo. Declare que uma fonte geralmente é feita usando `@font-face` no topo da sua folha de estilo CSS. ```css @font-face { font-family: "My Super Awesome Open Sans Font"; /* name that you will use later to apply the font */ src: url("/fontfolder/open-sans.woff"); /* path to the file */ } body { font-family: "My Super Awesome Open Sans Font"; } ``` Observe que você também pode especificar o formato da fonte de acordo com a compatibilidade do navegador como a seguir. ```css @font-face { font-family: "My Super Awesome Open Sans Font"; src: url("/fontfolder/open-sans.woff"); format("woff"), } ``` ### Google Fonts Com o Google Fonts, você não precisa fazer o upload dos arquivos de fontes no seu site, basta colocar um determinado link na `head` do seu site. Para usar o Google Fonts, navegue pelo [site](https://fonts.google.com/) para encontrar a fonte que funciona melhor para o seu projeto. Depois de escolher, clique no sinal de mais (+) ao lado da fonte. Uma barra aparecerá na parte inferior da tela. Clique nisso. Você receberá várias linhas de código. Copie e cole a linha de HTML na cabeça do seu arquivo HTML acima do existente elemento. Então pegue o CSS e use-o onde for necessário na sua folha de estilo. ```html Some text. ``` ```css body{ font-family: "Inconsolata", monospace; } ``` Você está feito! Você tem novas fontes para o seu site. ##### Recursos adicionais: * [Google Fonts](http://fonts.google.com) * [FontSpace](http://www.fontspace.com) * [Esquilo fonte](http://fontsquirrel.com) * [DaFont](http://www.dafont.com) * [1001 Fontes Gratuitas](http://www.1001freefonts.com) #### Mais Informações: * [Visão geral de fontes da Web da Mozilla Developer Network](https://developer.mozilla.org/en-US/docs/Learn/CSS/Styling_text/Web_fonts)