# Tipos de letra para títulos: fontes que chamam a atenção

[Canonical HTML page](https://gradiently.design/pt-pt/guide/headline-fonts)

Um título tem cerca de um segundo para ser lido. O tipo de letra faz uma parte surpreendente desse trabalho. Eis fontes gratuitas que merecem atenção, agrupadas pela tarefa em que são melhores, com combinações que podes usar hoje.

## The short version

- Bons tipos de letra para títulos têm formas de letra claras, pesos fortes e carácter suficiente para se reconhecerem num relance.
- As fontes condensadas como a Anton e a Bebas Neue acomodam palavras longas em tamanhos grandes, o que serve cartazes e miniaturas.
- As serifadas de alto contraste, como a Playfair Display e a DM Serif Display, dão aos títulos um tom editorial e refinado.
- Uma fonte de título costuma combinar-se com uma fonte de texto mais discreta, como a Inter ou a DM Sans, para tudo o resto.
- Os títulos em tamanho grande costumam precisar de espaçamento entre letras e entre linhas um pouco mais apertado do que o predefinido da fonte.

Os melhores **tipos de letra para títulos** são os que se leem num só relance em tamanhos grandes e que levam um tom claro: sem serifas condensadas como a Anton ou a Bebas Neue para impacto, grotescas pesadas como a Archivo Black para peso, e serifadas de alto contraste como a Playfair Display ou a DM Serif Display para elegância. Todas são gratuitas no [Google Fonts](https://fonts.google.com). A escolha certa depende menos do gosto do que da tarefa: quantas palavras, quanto espaço e o que o título precisa de transmitir.

## O que faz um bom tipo de letra para títulos

- **Formas claras num relance.** Contraformas abertas e letras distintas, para que as palavras se leiam antes de o olho assentar.
- **Peso de sobra.** Uma família com bold, extra bold ou black, porque os títulos em telemóvel precisam de traços pesados.
- **Bom espaçamento e kerning de origem.** A letra grande amplia cada intervalo; as fontes bem feitas precisam de menos correções. Vê [kerning](https://gradiently.design/pt-pt/guide/kerning).
- **Um tom que combine com a mensagem.** Forte, calmo, luxuoso ou técnico. A fonte di-lo antes das palavras.
- **A largura certa para o teu espaço.** As condensadas encaixam palavras longas em formatos estreitos; as largas servem palavras curtas com espaço à volta.

## As melhores fontes gratuitas para títulos, por estilo

| Estilo | Google Fonts a experimentar | Soa a | Ideal para |
| --- | --- | --- | --- |
| Sem serifas condensada | Anton, Bebas Neue, Oswald, Barlow Condensed, Big Shoulders Display | Forte, urgente, desportiva | Cartazes, miniaturas, publicações de saldos |
| Grotesca pesada | Archivo Black, Inter Tight, Work Sans em black | Direta, moderna, sem rodeios | Anúncios, lançamentos de produtos |
| Sem serifas geométrica | Montserrat, Poppins, Outfit, League Spartan | Simpática, limpa, redonda | Startups, serviços, publicações sociais |
| Sem serifas com carácter | Bricolage Grotesque, Space Grotesk, Syne | Distinta, atual, um pouco excêntrica | Marcas que querem uma voz |
| Serifada de alto contraste | Playfair Display, DM Serif Display, Instrument Serif | Editorial, refinada, cara | Moda, beleza, revistas, ementas |
| Serifada suave | Fraunces, Young Serif | Calorosa, artesanal, acessível | Comida, cafés, lojas independentes |

Uma primeira lista curta. Todas as fontes aqui são gratuitas no Google Fonts sob uma licença aberta que permite uso comercial.

Algumas notas que vale a pena saber antes de escolheres. A **Bebas Neue** só tem maiúsculas, por isso serve linhas curtas e gritadas e não frases. A **Oswald** é uma reinterpretação do clássico estilo Alternate Gothic e vem em vários pesos, o que a torna mais flexível do que a Anton. A **Fraunces** é uma fonte variável com eixos de suavidade e um modo divertido e irregular, por isso uma só família pode ir do nítido ao fofo. A **Syne** fica visivelmente mais larga nos pesos mais pesados, o que dá a um título forte uma presença real.

Uma publicação vertical de saldos com SALDOS DE VERÃO em maiúsculas condensadas grandes sobre um gradiente vivo

Palavras curtas e gritadas em maiúsculas: o registo para que uma fonte condensada como a Anton ou a Bebas Neue foi feita.

Uma publicação vertical editorial com um título em serifada refinada que diz O regresso discreto do linho

Um título editorial pede o contrário: uma serifada de alto contraste como a Playfair Display abranda o leitor e sinaliza cuidado.

## Como escolher um tipo de letra para títulos

1. **Escreve primeiro o título verdadeiro** Testa com as tuas palavras reais, não com o texto de amostra da fonte. Uma fonte que fica ótima em “Hamburgefonts” pode ficar estranha no nome da tua marca.
2. **Mede o espaço** Um título longo num formato estreito, como um story ou um pin, precisa de uma fonte condensada. Linhas curtas em formatos largos podem ter uma mais larga.
3. **Combina o tom com a mensagem** Escreve três palavras para o modo como o título deve soar. Escolhe só as fontes que servem as três.
4. **Testa no menor tamanho real** Reduz o design ao tamanho de telemóvel, ou de miniatura numa grelha. Os traços finos e as contraformas apertadas falham primeiro.
5. **Combina-a com uma fonte de texto discreta** Escolhe uma fonte calma e legível para o texto de apoio, para que o título continue a ser o mais forte da página.

## Combinar fontes de título com texto corrente

Uma fonte de título é uma especialista. Brilha a 90 px e cansa o olho a 16 px. Combina-a com uma fonte de trabalho que se leia bem em parágrafos e não dê nas vistas. As combinações mais seguras contrastam de uma forma clara, normalmente serifada contra sem serifas, ou condensada contra largura normal. [Combinação de fontes](https://gradiently.design/pt-pt/guide/font-pairing) explica os princípios, e [combinações de Google Fonts](https://gradiently.design/pt-pt/guide/google-fonts-pairings) tem muitas mais.

| Título | Texto | Porque funciona |
| --- | --- | --- |
| Anton | Inter | Impacto condensado sobre uma sem serifas neutra e muito legível |
| Playfair Display | Source Sans 3 | O contraste editorial clássico de serifada e sem serifas |
| Bricolage Grotesque | DM Sans | Um título com carácter sobre um texto geométrico e calmo |
| DM Serif Display | DM Sans | Desenhadas como companheiras, por isso as proporções combinam |
| Archivo Black | Archivo | Uma família em dois pesos, a combinação mais simples que há |
| Fraunces | Manrope | Serifada suave e calorosa sobre uma sem serifas limpa e moderna |

Seis combinações feitas com Google Fonts gratuitas. Usa a fonte de título para uma ou duas linhas; deixa a fonte de texto levar o resto.

## Como compor o título: tamanho, espaçamento e entrelinha

Mesmo a fonte certa parece fraca com as definições por omissão. A letra grande precisa de espaçamento e entrelinha mais apertados do que o texto corrente, e de menos palavras. Na prática isso significa espaçamento entre letras de cerca de menos 0,01 a menos 0,03 em e entrelinha de cerca de 1,0 a 1,1. Numa publicação social de 1080 px, um título costuma ficar entre 90 e 140 px; [tamanho de letra para publicações de Instagram](https://gradiently.design/pt-pt/guide/font-size-for-social-media) tem a escala completa.

### Evita

- Um peso leve para o título principal num telemóvel
- Fontes manuscritas ou decorativas em títulos longos
- Entrelinha por omissão num título de três linhas
- Duas fontes de exibição diferentes num só design
- Doze palavras em tamanho de título

### Faz

- De semibold a black para redes sociais e miniaturas
- Uma fonte de exibição para impacto, uma sem serifas para o pormenor
- Entrelinha perto de 1,05 em linhas empilhadas
- Uma só fonte de título, usada com consistência
- De cinco a oito palavras, cortando até custar

```html
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Anton&family=Inter:wght@400;600&display=swap" rel="stylesheet">

<style>
  h1 {
    font-family: "Anton", "Arial Narrow", sans-serif;
    font-size: clamp(2.75rem, 7vw, 6rem);
    line-height: 1.02;
    letter-spacing: -0.01em;
  }
  body {
    font-family: "Inter", system-ui, sans-serif;
  }
</style>
```

Carregar uma combinação de título e texto do Google Fonts. A pilha de recurso mantém a linha com uma largura semelhante enquanto a fonte carrega.

O fundo também importa. Um título pesado sobre um gradiente carregado pode desfazer-se onde a cor muda por trás. Os Marks do Gradiently movem a sua zona mais calma para trás das tuas palavras e escolhem tinta clara ou escura linha a linha, e os tratamentos de Lettering, como Contorno, Interior e Extrusão, dão ao título presença extra sem caixas nem sombras. Para letra grande em cartazes, vê [fontes de exibição](https://gradiently.design/pt-pt/guide/display-fonts) e [fontes grossas](https://gradiently.design/pt-pt/guide/bold-fonts); para miniaturas, [texto em miniaturas](https://gradiently.design/pt-pt/guide/typography-for-thumbnails).

## FAQ

### Qual é o melhor tipo de letra para títulos?

Depende da tarefa. A Anton ou a Bebas Neue servem títulos curtos e fortes; a Playfair Display ou a DM Serif Display servem os editoriais; a Montserrat ou a Outfit servem os simpáticos e limpos.

### As Google Fonts são gratuitas para uso comercial?

As fontes do Google Fonts são lançadas com licenças abertas, sobretudo a SIL Open Font License, que permitem uso comercial. A página de cada fonte no Google Fonts mostra a licença, por isso confirma-a antes de contares com ela. [Licenças de fontes](https://gradiently.design/pt-pt/guide/font-licensing) explica os pormenores.

### Os títulos devem ser serifados ou sem serifas?

Ambos funcionam. As sem serifas soam diretas e modernas; as serifadas soam editoriais e refinadas. Escolhe pelo tom que queres e combina com o oposto para o texto corrente.

### Que tamanho de letra deve ter um título?

Numa publicação social de 1080 px, cerca de 90 a 140 px. Num site, aproximadamente 2,5 a 4 vezes o tamanho do texto, conforme a tua escala tipográfica.

### Posso usar duas fontes de título num só design?

Raramente é boa ideia. Uma fonte de exibição mais uma fonte de texto calma dá uma hierarquia mais clara e parece mais deliberada.
