Ao criar um site, você precisa ter todas as ferramentas adequadas para causar um impacto efetivo. Isto inclui uma série de fontes modernas!

Entretanto, seu tema pode não ter a seleção de fontes HTML que você precisa escolher. Ou, você pode não estar satisfeito com as que foram selecionadas para você.

Devido a estes fatores, ser capaz de instalar algumas fontes personalizadas é essencial. Vamos discutir aqui hoje uma variedade de opções de fontes. Mas primeiro, vamos tirar as coisas técnicas do caminho.

O que realmente torna uma fonte moderna?

As fontes modernas não são de forma alguma novas. O estilo foi originalmente desenvolvido no século XVIII. Apesar disso, seus designs continuam sendo relevantes no mundo moderno. Na verdade, você as vê literalmente em todos os lugares.

Então, como são as fontes modernas?

As fontes modernas são afiadas, elegantes, arrojadas, profissionais e elegantes. Elas também são frequentemente sans serif (mas nem sempre) e às vezes se encaixam na categoria de fontes cursivas. Seu design é imediatamente reconhecível e frequentemente usado em cabeçalhos e logos. Elas podem ser corporativas, mas não agressivas. Ao contrário, são ousadas e exigem atenção.

Aqui está um exemplo de um site de portfólio que utiliza uma fonte moderna.

Reparou como é condensado e estreito?

chris wilhite
chriswilhitedesign.com

Estas são generalidades, é claro. A tipografia moderna evoluiu e, muitas vezes, você pode encontrar também exemplos mais estilísticos. Mas esperamos que isto lhe dê uma idéia geral do que é uma fonte moderna (e por que você pode querer usar uma).

Como fazer o upload de fontes baixadas para o WordPress

As fontes personalizadas baixadas da web requerem um pouco mais de trabalho para funcionarem, já que não podem ser simplesmente importadas como em serviços on-line como o Google Fonts. Em vez disso, é necessário carregá-las manualmente ou utilizar um plugin para realizar essa tarefa.

Antes de fazer qualquer upload, é preciso certificar-se de que as fontes estão prontas para uso na web. Isso significa que nem todas as fontes são seguras ou compatíveis com todos os navegadores, e podem precisar de ajustes antes de serem usadas.

Basta usar a ferramenta gratuita Webfont Generator para transformar qualquer fonte personalizada que você tenha encontrado on-line em um formato legível e utilizável por todos os navegadores da internet.

Transformar quaisquer fontes em fontes seguras para a web
Transformar quaisquer fontes em fontes seguras para a web

Completar este passo também ajudará muito na otimização da velocidade das suas fontes. No entanto, isso não é tudo. Você também deve seguir algumas dicas para garantir que suas fontes personalizadas não estejam consumindo recursos ou diminuindo desnecessariamente o tempo de carregamento do seu site:

  • Verifique o desempenho. Usando GTmetrix, monitore o número de solicitações HTTP. Se houver muita coisa, isso pode significar que seu site está usando muito mais fontes que você percebeu. Estou falando de fontes instaladas automaticamente ao lado de plugins e temas aqui (não as que você adicionou manualmente).
  • Verifique sua análise.Aqui, você pode verificar quais formatos de arquivos de fontes são mais acessados em seu site. Os formatos mais comuns são EOT, TTF, WOFF e WOFF2. Ao considerar quais formatos suportar, isso pode ajudá-lo a determinar quais devem ter prioridade.
  • Certifique-se de que as fontes sejam armazenadas localmente. Não é como se você estivesse atualizando as fontes dia sim, dia não. Isso significa que as fontes podem ser armazenadas em cache nos navegadores dos visitantes frequentes com segurança. Isto limitará o número de solicitações HTTP ao longo do tempo.

O carregamento manual de fontes requer um pouco de habilidade técnica, mas não está fora do alcance da maioria dos proprietários de sites.

  1. Faça o download da sua fonte moderna personalizada escolhida (muitos exemplos abaixo).
  2. Salve um backup do seu site (incluindo todo o conteúdo e o banco de dados) e/ou use um child theme (tema filho) para as seguintes mudanças.
  3. Carregue os arquivos de fontes em um . zip para a pasta wp-content/themes/your-theme-name/fonts. Se não houver uma pasta “fonts”, então carregue seu arquivo de fonte . zip lá. Use qualquer cliente FTP de sua escolha para realizar isto.
  4. No painel do WordPress, navegue até Appearance > Theme Editor e acesse o arquivo style.css. Você precisará adicionar um trecho de código personalizado a este arquivo. Adicione a família de fontes e a URL apropriada ao trecho de código e clique em Atualizar arquivo.
@font-face { 
font-family: YOUR FONT NAME; 
src: url(http://sitename.com/wp-content/themes/themename/fonts/font-name.ttf); 
font-weight: normal; 
}

O código acima acrescenta a fonte ao seu site. A seguir, você precisa dizer ao WordPress onde a fonte deve ser usada. Para isso, abra novamente o arquivo style.css e use este trecho de código:

.SITE ELEMENT {
font-family: "FONT NAME", Helvetica, sans-serif; 
}

Neste trecho de código, você precisa identificar a qual aspecto do seu site você deseja que a fonte se aplique e especificar o nome da fonte antes de atualizar o arquivo.

Por outro lado, se você quiser pular todo esse processo de upload manual, pode usar um plugin para adicionar fontes ao WordPress. Uma opção sólida é o Use Any Font. Como o nome sugere, você pode usá-lo para carregar qualquer fonte personalizada em seu site e atribuí-la a elementos CSS.

56 das fontes mais modernas para usar em 2024

Agora que você sabe como otimizar e carregar fontes personalizadas, podemos agora oferecer uma lista saudável de fontes modernas e opções para escolher.

1. Intro

Modern fonts: intro
Intro

Intro é uma fonte moderna de aparência padrão que oferece linhas arrojadas e apresentação que poderiam ser facilmente utilizadas para cabeçalhos ou títulos. Esta família de fontes inclui 72 fontes com 8 pesos diferentes, de fino a grosso, dando-lhe toneladas de flexibilidade.

2. Komoda

Modern fonts: komoda
Komoda

Outra opção é a Komoda. Esta fonte é condensada e super interessante de se ver. É tudo em maiúscula e sans serif com um olhar de bloco onde a linha média de cada letra é levantada para cima. E suas ligaduras fazem uma declaração. Uma escolha perfeita para logos aqui.

3. Stoked

Modern fonts: stoked
Stoked

Stoked é outra opção com letras maiúsculas que oferece uma aparência única para cabeçalhos e logos. É interessante enquanto permanece legível. Sua característica definidora é a inclusão de linhas duplas em cada letra, além de quebras de linha que lhe conferem uma aparência de estêncil.

4. Classy Marisa

classy marisa
Marisa

Há também a Classy Marisa. Esta fonte moderna é elegante e florida, oferecendo uma opção de fonte mais fina e delicada para logos e cabeçalhos. Tem ligaduras realmente interessantes, glifos alternativos e ornamentos também que acrescentam mais caráter a qualquer texto que você queira compartilhar.

5. Canter

canter
Canter

Canter é outra ótima opção. Esta é uma fonte sans-serif que apresenta todas as letras maiúsculas e tem espaçamento condensado. Ela vem em seis pesos diferentes, incluindo uma opção em 3D e uma com uma sombra pronunciada.

6. Lucky

lucky
Lucky

Lucky é outra fonte moderna que vale a pena considerar. É outra seleção sem serifa que poderia funcionar bem como uma logo ou cabeçalho. Tem também uma qualidade editorial distinta que poderia ser facilmente aplicada a revistas e publicações on-line.

7. Zafir

Modern fonts: zafir
Zafir

Zafir oferece

Zafir é uma ótima escolha de fonte moderna que vale a pena considerar. Com sua apresentação super minimalista, é uma fonte serif de todas em maiúsculas com linhas curvas e um visual geral interessante que pode funcionar bem para logos e títulos.

8. Coves

coves
Coves

Ou você poderia usar Coves. Ela vem com dois pesos, leve e ousada, e oferece uma opção de fonte elegante e simplificada para seus projetos mais recentes. Use-a para textos padrão e também para títulos e cabeçalhos. É verdadeiramente multiúso.

9. Azonix

azonix
Azonix

Azonix fornece

Azonix oferece outra seleção moderna de fontes, desta vez com um toque futurista. É uma fonte, tipo sans serif que enfatiza um visual geométrico. É toda em caixa alta e facilmente parece que poderia ser usada na sequência de créditos de abertura de um filme de ficção científica.

10. Arkhip

arkhip
Arkhip

O Arkhip é outra seleção livre de fontes que mantém um design moderno ao mesmo tempo, em que relembra as épocas passadas. Ela usa elementos da tipografia russa para criar algo moderno e verdadeiramente novo.

11. Prime

Modern fonts: prime
Prime

Há outra fonte a ser considerada chamada Prime. É uma fonte moderna sem serifa que apresenta linhas arrojadas e tem um aspecto futurista geral. Ela tem cantos geométricos e parece perfeita para websites com temas futuristas ou tecnológicos.

12. Glober

glober
Glober

Glober é outra fonte moderna para a qual você deve dar uma olhada. Esta família de fontes inclui 18 pesos com uma divisão uniforme de 9 verticais e 9 em itálico. É uma fonte san serif que é fácil de ler e fácil de aplicar a uma série de situações diferentes, incluindo títulos, bem como o corpo do texto.

13. MADE Gentle

made gentle
MADE Gentle

MADE Gentle é outro tipo de face moderna digno de consideração. É considerada uma serifa macia e inspirada na fonte Cooper Black. Esta é uma fonte retrô ousada, mas arredondada que lembra as capas de livros antigos e a sinalização dos anos 70.

14. Nordic

nordic
Nordic

Nordic é simultaneamente moderno e clássico e oferece dois tipos e três pesos à escolha. O design foi inspirado nas runas norueguesas e seria perfeito para uso em títulos, cabeçalhos e logos.

15. Maddac

Modern fonts: maddac
Maddac

A fonte Maddac oferece uma opção elegante para seu website. É ousada, em bloco, e sem serif. É moderna no design e única na execução. Cada letra tem um leve ângulo ou inclinação para um aspecto de seu design, oferecendo um pouco de estilo à equação.

16. Croc

croc
Croc

Croc não é uma fonte tão legal? É uma serifa ousada com um estilo icônico que é nostálgico enquanto ainda está fresco.

17. Aqua

Modern fonts: aqua
Aqua

Aqua é outra fonte para a qual você deve dar uma olhada. Esta tem uma qualidade art nouveau que a faz parecer intemporal. É ousada, mas simples e apresenta ornamentos e ligaduras que a fazem sobressair de outras fontes similares.

18. Manifesto

manifesto
Manifesto

Faça uma declaração ousada com Manifesto. Essa fonte foi inspirada no movimento racionalista italiano com uma qualidade editorial decididamente forte. Use-a para títulos, logos e cabeçalhos. Use-a para designs impressos e on-line. Ela é verdadeiramente versátil dessa maneira.

19. Orkney

orkney
Orkney

Orkney é uma bela fonte de aparência profissional. A fonte é de desenho geométrico e pode ser usada para uma grande variedade de propósitos. Utilize-a para títulos ou logos. Use-a para textos padrão. Use-a na impressão ou em mídia digital. O céu é o limite aqui.

20. Elppa

elppa
Elppa

Elppa tem um olhar futurista que é cativante e multifacetado. O tipo de letra é bastante mínimo, ao mesmo tempo em que capta uma espécie de sensação da era espacial. Utilize-a para projetos impressos e web. Funcionaria para logos e títulos, provavelmente não corpo de texto, mas definitivamente útil para gráficos e afins.

21. Corn

corn
Corn

Corn é uma fonte interessante que apresenta cantos arredondados e uma sensação de estilo campestre é a “Farmhouse Country”. Ela oferece 14 estilos diferentes que podem ser utilizados imediatamente para títulos, cabeçalhos e logos. Alguns estilos podem até mesmo ser usados para o corpo do texto, se desejado. Com essa fonte, você pode construir um design inteiro para o seu site.

22. Koliko

koliko
Koliko

Ou você poderia optar por Koliko, uma fonte seriamente divertida que tem apelo instantâneo para uma grande variedade de propósitos. Ela vem com três estilos, cada um abraçando um casamento perfeito de forma e função.

23. Quirk

Modern fonts: quirk
Quirk

Quirk éQuirk é uma fonte bastante excêntrica. O nome é uma boa escolha. É uma fonte em maiúsculas que inclui ligaduras e elementos empilháveis divertidos.

24. Le French

le french
Le French

Le French é uma escolha de fonte sofisticada, especialmente se você estiver procurando replicar essa sensação de café francês vintage. Uma excelente escolha para cardápios e sites relacionados a alimentos em todos os lugares. Use-o também para títulos, cabeçalhos, logos e corpo de texto.

25. Munich

munich
Munich

Munich é uma bela escolha de fonte sans-serif que seria excelente para uma logo ou título gráfico. É alta e imponente sem ser intimidadora.

26. Northwest

northwest
Northwest

Northwest é uma fonte de estilo moderno com um toque retrô. É uma reminiscência de logos de equipamentos de campanha e títulos de revistas ao ar livre. Com serifas de boxe e elementos decorativos, esta fonte funcionaria bem para qualquer tipo de conteúdo com temática externa.

27. Modeka

modeka
Modeka

Modeka é simplesmente incrível. É uma escolha moderna que pode ser adaptada de diversas maneiras. Com ângulos adicionais em cada letra, oferece um estilo único que pode ser adequado ao seu próximo design.

28. Disclaimer

disclaimer
Disclaimer

Disclaimer é uma fonte estreita e ousada que é excelente para uma ampla variedade de propósitos. Ela tem um estilo super-condensado que faz com que as letras fiquem altas e imponentes. Isso funcionaria muito bem para um cabeçalho ou título.

29. 5th Avenue

5th avenue
5th Avenue

5th Avenue é positivamente chique com um ar clássico bem adequado para logos e marcas oficiais. É uma fonte arrojada com serifas que se destaca graças a muitas letras alternativas que acrescentam estilo e interesse.

30. Quakiez

Modern fonts: quakiez
Quakiez

Quakiez é outra opção de fonte moderna que oferece uma opção serifa à nossa lista. Foi projetada com o luxo em mente, mas ainda mantém um elemento de minimalismo. Ela vem com dois estilos e pode ser usada para logos, títulos, cabeçalhos, e muito mais.

31. Modern Outdoor

modern outdoor
Modern Outdoor

Ou você poderia optar pelo Modern Outdoor e imediatamente invocar acampamentos e outdoors à vista. Esta fonte é perfeita para títulos, cabeçalhos e logos e faria uma declaração impactante em cartazes. Ela exige atenção e estar toda em maiúsculas garante ainda mais sua sensação ao ar livre.

32. Hyperbola

Modern fonts: Hyperbola

Hyperbola é arredondada e futurista. Na verdade, ela parece positivamente espaçosa – de uma boa maneira. Esta fonte tem contadores arredondados enquanto mantém uma forma geral boxeada.

33. Boxing

boxing
Boxing

A fonte Boxing tem um estilo retangular e limpo, perfeito para cabeçalhos, títulos e logos. Ela é totalmente em maiúsculas, alta e interessante de se olhar. O melhor de tudo é que ela é extremamente funcional e pode ser reaproveitada de inúmeras maneiras.

34. Sonder

sonder
Sonder

Sonder é outra fonte multifacetada, de fato. Ela vem com opções de fonte slab e sans serif. Ela vem com vários pesos, bem como um estilo regular e áspero. O estilo áspero apresenta algumas lacunas nas letras, criando uma aparência rústica e natural.

35. Lombok

lombok
Lombok

Lombok é uma fonte elegante e fina. É uma opção sem serifa com elementos geométricos que a tornam única. É uma escolha ideal para cabeçalhos, logos e títulos.

36. Distrito

distrito
Distrito

Distrito é uma fonte em todas as maiúsculas que tem um estilo distinto. Cada letra é ligeiramente inclinada, oferecendo uma aparência única que poderia ser bem traduzida para uso em logos e cabeçalhos. É também uma fonte em todas as maiúsculas inspirada no design modular colombiano.

37. Ailerons

ailerons
Ailerons

Ailerons é outra escolha sofisticada de fonte que oferece um visual clássico. Esta fonte toda em maiúsculas é supercondensada e exigente, oferecendo estilo imediato a tudo em que é usada.

38. Ethna

Modern fonts: ethna
Ethna

Ethna tem uma aparência clássica, mas um estilo moderno. É uma família de fontes sem serifa inspirada no design humanista e faz um bom trabalho em combinar elementos de design vintage e moderno para criar algo novo. Esta fonte funciona bem em qualquer caso de uso.

39. Noelle

noelle
Noelle

Noelle é uma fonte geométrica com serifas que está pronta para causar uma boa primeira impressão. Ela tem um design minimalista e funcionaria bem para títulos e cabeçalhos em qualquer setor. Possui alguns elementos vintage, mas ainda parece fresca. Use-a on-line ou em impressos. Além disso, vem com uma fonte de script como bônus.

40. Sequel

sequel
Sequel

Sequel é uma fonte arredondada perfeita para logos e cabeçalhos. O melhor de tudo é que ela vem com uma série de ligaduras que oferecem estilo e acrescentam interesse a qualquer coisa que você crie com elas. O design aqui é ousado, mas não imponente.

41. Higher

Higher

Higher é outra escolha sofisticada de fonte que oferece uma aparência clássica. Esta fonte com todas as letras em maiúsculas é super condensada e imponente, oferecendo estilo imediato a qualquer coisa em que você a utilizar.

42. Nano

nano
Nano

Nano é uma fonte não-seriforme que tem um aspecto futurista e é toda em letras minúsculas, o que a torna uma opção única nesta lista. As próprias letras são super modernas e identificáveis, tornando-a uma ótima escolha para logos e outros materiais de marca. É melhor para frases curtas, porém frases mais longas podem ser um pouco ilegíveis.

43. Jollin

jollin
Jollin

Jollin é uma fonte moderna com traços curvos em algumas letras e um visual geral robusto. Esta fonte sem serifa vem em uma versão regular e itálica e inclui uma variedade de letras alternativas para que você possa tornar o seu texto mais simples ou mais sofisticado, dependendo do seu humor.

44. Phenomena

phenomena
Phenomena

Phenomena é uma fonte estreita e robusta com bordas arredondadas. Ela chama a atenção e pode ser facilmente usada em títulos, logos ou cabeçalhos. Ela vem com 7 estilos diferentes, desde o fino até o negrito, oferecendo muitas oportunidades de uso de texto padrão também.

45. Calibre

calibre
Calibre

Calibre é uma fonte super condensada que pode se sobrepor seu conteúdo se você o deixar – de uma boa maneira. É uma opção com todas as letras em maiúsculas que também inclui números, glifos e caracteres ocidentais para uma boa medida.

46. Sundays

sundays
Sundays

Sundays é uma fonte serifada que definitivamente pertence à era atual, mas também tem uma sensação clássica que é inegável. É mais fina e curvilínea do que as fontes similares clássicas, e tem um estilo que se encaixaria em títulos de revistas, logos de sites, cabeçalhos e muito mais.

47. Cornerstone

cornerstone
Cornerstone

Cornerstone é outra fonte angulosa que oferece um design modular que pode funcionar em vários aplicativos diferentes, desde logos até cabeçalhos.

48. One Day

one day
One Day

One Day é uma fonte fina com linhas desconectadas interessantes que a tornam única. É outra fonte toda em maiúsculas com um estilo leve e fino. Inclui números e glifos e tem uma sensação geométrica sem ser muito quadrada.

49. Kollektif

kollektif
Kollektif

Kollektif é uma fonte moderna clássica que pode ser usada de várias maneiras. Ela tem um design geométrico e vem em duas espessuras. Além disso, é otimizada para uso tanto em impressão quanto na web.

50. Nostalgia

Modern fonts: nostalgia
Nostalgia

Depois há a Nostalgia, outra fonte moderna com apelo retrô suficiente para fazê-la parecer como se tivesse sido criada décadas atrás. Ela inclui 3 fontes, bem como glifos, ligaduras e flores alternativos. Seria uma ótima escolha para logos, títulos, cartazes ou convites.

51. Elixia

elixia
Elixia

A Elixia tem um aspecto etéreo próprio do covil de um alquimista. É geométrica e inclui ângulos de linha extras em cada letra que oferecem um estilo único.

52. Salmon

salmon
Salmon

Ou você poderia optar pelo Salmon. Esta fonte sans serif é ousada e minimalista. É ideal para títulos, logos e cabeçalhos. É um design de todas as letras maiúsculas e inclui uma versão preenchida e contornada que combina bem juntas também.

thinoo
Thinoo

Thinoo é outra fonte san serif. Ela vem com um estilo fino e arrojado e inclui todos os estilos de letras, incluindo números, símbolos e pontuação. É profissional e limpa. Simples, mas atraente. Esta funcionaria bem para qualquer tipo de site, bem como para materiais impressos.

54. Summer Loving

summer loving
Summer Loving

Ou você poderia usar o Summer Loving, uma fonte moderna super divertida que inclui vários estilos de fonte para que você possa criar um design inteiro usando apenas uma fonte. Ela vem com uma fonte sem fonte, bem como um detalhe de pincel que pode imediatamente acrescentar dimensão a seus projetos. Ela inclui também ligaduras e letras alternadas.

55. Silverfake

Silverfake
Silverfake

Silverfake oferece uma opção de fonte serifada com espaçamento amplo para títulos, logos, cabeçalhos e materiais impressos. Essa seria ótima para uma logo em camiseta, por exemplo.

56. Vienna

vienna
Vienna

Finalmente, há Vienna. Esta fonte moderna é uma opção serif que tem todo o apelo de uma fonte clássica usada em capas de revistas com modificações suficientes para apelar para a estética atual. É mínima e inclui letras maiúsculas, números e pontuação.

Resumo 

Há uma série de razões pelas quais você pode querer usar fontes personalizadas em seu site. Se você quer se adequar melhor à sua marca ou tornar seu conteúdo mais legível em todos os navegadores, vale a pena fazer o upload de suas próprias fontes de estilo moderno.

Mesmo assim, o processo pode parecer assustador no início. Você tem que encontrar uma fonte, baixá-la, colocá-la em um arquivo . zip e depois carregá-la no diretório correto em seu site usando um cliente FTP. Você precisará colar trechos de código nas áreas apropriadas do arquivo CSS do seu tema. Você pode optar por fazer isso manualmente ou através do uso de um plugin (ou você pode contratar um desenvolvedor).

Não importa como você aborde este processo, entretanto, você pode ter certeza de que o resultado final será elegante e acrescentará caráter à aparência geral do seu site. Esperamos que a coleção de 56 fontes modernas que curamos aqui o ajude a descobrir a apropriada para o seu site. Seja ela ousada ou fina, arredondada ou dura, embelezada ou simples, a fonte que você escolher causará um impacto!

(Leitura sugerida: Como Esconder a Página e Publicar Títulos no WordPress)

Brenda Barron

Brenda Barron is a journalist and copywriter from California. She contributes to sites like WPMU DEV, Envato, and Torque.