fbpx

Top 5 sites de fontes tipográficas para Web - Evertec Digital | Blog

Top 5 sites de fontes tipográficas para Web

Criamos uma seleção com os cinco melhores sites para encontrar as fontes tipográficas certas para seus projetos web, sendo que a maioria deles, disponibilizam fontes gratuitamente.

Compartilhe esse conteúdo!

Em nosso artigo “Como escolher a fonte tipográfica certa para seu projeto“, falamos sobre a importância de escolher corretamente a fonte tipográfica e como aplica-la de maneira mais assertiva em seus projetos web. Se ainda não leu o artigo, acredito que ele seja um conteúdo altamente relevante para o aprimoramento de suas habilidades como designer.

Agora, se você já leu nosso artigo, você já sabe o que considerar na escolha do tipo de fonte, e, para lhe ajudar, preparamos uma lista com os 5 melhores sites para você encontrar as fontes tipográficas certas para seus projetos.

Google Fonts

Google Fonts

Um dos mais populares repositórios da web que não pode faltar na sua lista de favoritos.. Acesse o Google Fonts.

Adobe Edge Web Fonts

Adobe Edge Web Fonts

É uma das ferramentas gratuitas da Adobe. O Adobe Edge Web Fonts é um serviço que fornece acesso ilimitado a uma grande biblioteca de fontes para o seu site e materiais gráficos. Com um filtro inteligente que facilita muito na busca da fonte perfeita para seus projetos. Acesse o Adobe Edge Web Fonts.

Dafont

Dafont

Possui um acervo rico de fontes freeware, shareware, versões demo ou de domínio público. Muito popular entre os designers. Acesse o Dafont.

Font Squirrel

Font Squirrel

Um acervo selecionado exclusivamente de fontes gratuitas para você utilizar em seus sites e projetos gráficos. Acesse Font Squirrel.

Urbanfonts

Urbanfonts

Um site multi-idioma, característica essa que auxilia na busca da tipografia desejada. Além de possuir um filtro de opções muito sugestivo. Acesse Urbanfonts.

Como aplicar fontes em seu site?

Se você ainda não sabe como aplicar as fontes em seu site, iremos mostrar aqui. Basicamente existem duas formas, sendo:

1 – Baixe a fonte e armazene junto com o código fonte do seu site. Para isso será necessário lincar as fontes em seu arquivo de estilo, da seguinte forma:

@font-face {
    font-family: Californian FB;
    src: url(fonts/CALIFB.TTF) format('truetype');
}

*, *:before, *:after{
     font-family: 'Californian FB', sans-serif;
}

2 – Lincando para o repositório CDN no qual a fonte se encontra disponível. Para isso, precisa fazer a chamada para a fonte, dentro da tag head do seu site, depois basta adicionar a família da fonte, como no exemplo abaixo:

<link href="https://fonts.googleapis.com/css?family=Roboto:400,700,900&display=swap" rel="stylesheet">

<style>
*, *:before, *:after{ font-family: 'Roboto', sans-serif; }
</style>

Você também pode fazer a importação diretamente do CDN externo no seu arquivo de estilo, sem a necessidade de baixa-la e armazena-la em sua hospedagem. Para isso, proceda da seguinte forma:

@import url('https://fonts.googleapis.com/css?family=Roboto:400,700,900&display=swap');

*, *:before, *:after{
   font-family: 'Roboto', sans-serif;
}

Eai, o que achou dessas dicas? Deixe nos comentários!


Compartilhe esse conteúdo!
Tags do Post:

Conteúdos Relacionados

Veja alguns conteúdos que também podem lhe interessar.

Mais Populares

Veja os nossos conteúdos mais acessados.