# A voz tipográfica de um Mark: por que todo Mark vem com fontes

[Canonical HTML page](https://gradiently.design/pt-br/guide/type-voice-of-a-mark)

Cor e textura são só metade de um visual. Todo Mark também traz uma fonte de título, uma fonte de texto e um jeito de compô-las, então o primeiro rascunho já soa como o fundo em que está.

## The short version

- A voz tipográfica de um Mark é a tipografia com que ele inicia todo design: uma fonte de exibição, uma de texto, um peso de exibição, o espaçamento entre letras e a caixa das letras.
- Os títulos seguem a fonte de exibição da voz e o restante do texto segue a fonte de texto, até você escolher outra.
- Você pode mudar a fonte de qualquer linha no Studio e colocar em uma página as fontes de título e de texto do seu kit de marca.
- Existe uma voz tipográfica porque as mesmas palavras soam diferentes em fontes diferentes, e um fundo e sua tipografia devem parecer uma só decisão.
- A página de um Mark no Mercado o mostra na própria voz e em outras cinco combinações: Editorial, Grotesk, Poster, Classic e Modern.

A **voz tipográfica** de um Mark é a tipografia que vem com ele: uma fonte de exibição para títulos, uma fonte de texto para todo o resto, um peso para a fonte de exibição, um espaçamento entre letras e uma caixa das letras. Quando você começa um design sobre um Mark, suas palavras aparecem nessa voz, então o primeiro rascunho já combina com o fundo. É um ponto de partida, não uma trava: toda linha pode ser mudada, e suas próprias fontes de marca podem substituí-la.

## Por que um fundo vem com fontes

A tipografia tem um tom de voz, como a fala. “As portas abrem às sete” em uma Garamond fina soa como a abertura de uma galeria; em maiúsculas condensadas soa como um show. Coloque qualquer uma no fundo errado e o design briga consigo mesmo. Um Mark de seda em ameixa profundo e um Mark de Op art em verde ácido pedem letras diferentes, e escolhê-las juntas é o que faz um visual parecer intencional.

Um convite de evento com o texto As portas abrem às sete, na voz tipográfica do primeiro Mark

Um Mark, na própria voz.

O mesmo convite em um segundo Mark com outra paleta, outro material e outra tipografia

As mesmas palavras em outro Mark, que traz a própria voz.

Há também um motivo prático. A maioria das pessoas que faz um post semanal não é tipógrafa, e a [combinação de fontes](https://gradiently.design/pt-br/guide/font-pairing) é um dos lugares mais fáceis de errar. Uma voz que já foi combinada com o seu Mark tira essa decisão de cada design.

## O que uma voz tipográfica contém

| Parte | O que define | Exemplo |
| --- | --- | --- |
| Fonte de exibição | Títulos e palavras grandes | Fraunces, Syne, Bebas Neue |
| Fonte de texto | Corpo do texto, detalhes, letras miúdas | Inter, Manrope, Newsreader |
| Peso | O quanto a fonte de exibição é pesada, de leve a extranegrito | 400 para uma serifa elegante, 700 para um pôster |
| Espaçamento | O espaço entre as letras, mais justo ou mais solto | Levemente justo para títulos grandes |
| Caixa | Como digitado, tudo em maiúsculas ou tudo em minúsculas | Maiúsculas para uma voz de pôster |

As cinco partes de uma voz. Juntas, elas decidem como cada título do Mark aparece antes de você mexer em qualquer ajuste.

As fontes vêm da biblioteca do Gradiently, que reúne serifadas como Fraunces, Playfair Display e EB Garamond, grotescas como Space Grotesk e Schibsted Grotesk, fontes de exibição condensadas como Anton e Oswald, fontes monoespaçadas, manuscritas e arredondadas. [Serifa ou sem serifa](https://gradiently.design/pt-br/guide/serif-vs-sans-serif) explica o que cada categoria tende a dizer.

Se você quer que seu site combine com um Mark, uma voz se traduz direto em CSS. Aqui está uma voz editorial típica escrita por extenso:

```css
h1, h2 {
  font-family: "Fraunces", Georgia, serif;
  font-weight: 400;
  letter-spacing: -0.02em; /* tracking */
  text-transform: none;    /* case: as typed */
}

body {
  font-family: "Inter", system-ui, sans-serif;
}
```

Fonte de exibição, peso, espaçamento e caixa para os títulos; a fonte de texto para todo o resto. As duas fontes estão no Google Fonts.

## Como o texto segue a voz

Cada trecho de texto em um design sabe se é um título ou um corpo de texto. Os títulos seguem a fonte de exibição, o peso, o espaçamento e a caixa da voz; o corpo de texto segue a fonte de texto. Enquanto uma linha não tiver fonte própria, ela continua seguindo; então, se você colocar outro Mark no design, as palavras assumem também a voz do novo Mark.

O painel de cor e tipografia do Studio mostra a voz do Mark como um par de título e texto e permite aplicá-lo à página inteira em um só passo. É útil quando um modelo chega em outras fontes e você quer que ele soe como o seu Mark.

## Como mudar a voz de um Mark nos seus designs

1. **Mude uma linha** Selecione o texto e escolha outra fonte, peso, espaçamento ou caixa. Essa linha passa a manter o próprio ajuste.
2. **Mude uma página inteira** Escolha uma fonte de título e uma de texto e aplique à página, para que todo título e parágrafo se movam juntos.
3. **Use as fontes da sua marca** Adicione uma fonte de título e uma de texto ao seu kit de marca, enviando arquivos OTF, TTF, WOFF ou WOFF2 se forem suas, e depois coloque as fontes da marca em uma página em um só passo.
4. **Peça ao Designer** O Designer aplica o kit de marca para você, então os designs que ele cria já começam nas fontes da sua marca.

Enviar uma fonte está em [enviar fontes personalizadas](https://gradiently.design/pt-br/guide/custom-fonts-upload), e o resto do kit em [configurar o kit de marca](https://gradiently.design/pt-br/guide/brand-kit-setup). Confira a licença antes de enviar uma fonte comercial; [licença de fontes](https://gradiently.design/pt-br/guide/font-licensing) explica o que observar.

## Testar um Mark em outras vozes

Na página de um Mark no [Mercado](/market), as prévias podem alternar entre a voz própria e cinco combinações prontas, para você ver o visual com uma tipografia mais próxima da sua marca antes de criar qualquer coisa.

| Combinação | Fonte de exibição | Fonte de texto | Sensação |
| --- | --- | --- | --- |
| Voz própria | Escolhida com o Mark | Escolhida com o Mark | Como o Mark foi feito |
| Editorial | Instrument Serif | Inter | Revista, galeria, ponderado |
| Grotesk | Space Grotesk | Space Grotesk | Estúdio, técnico, atual |
| Poster | Anton, em maiúsculas | Archivo | Forte, eventos, esporte |
| Classic | Cormorant Garamond | EB Garamond | Livresco, tradição, luxo discreto |
| Modern | Geist | Geist | Limpo, produto, software |

As combinações que a página de um Mark pode mostrar. Cada uma é uma dupla sólida e bem testada que você também pode usar nos seus designs.

## Quando manter a voz e quando trocar

### Mantenha a voz do Mark

- Você ainda não tem fontes de marca
- A voz já combina com o seu jeito de falar
- Você quer designs que combinem com o fundo
- Você publica com frequência e quer menos decisões

### Use suas próprias fontes

- Você tem um logotipo ou uma fonte de marca estabelecidos
- Sua embalagem, loja ou site já usa fontes definidas
- Você precisa de uma fonte que cubra idiomas específicos
- Várias marcas compartilham um estilo da casa

Em qualquer caso, fique com duas fontes no máximo e deixe tamanho e peso fazerem o resto. Uma hierarquia clara importa mais do que as fontes em si, como mostra [hierarquia visual](https://gradiently.design/pt-br/guide/visual-hierarchy). Se suas palavras ficam sobre um Mark, a legibilidade é tratada à parte: o Mark move sua região mais calma para trás do texto e a tinta automática escolhe texto claro ou escuro em cada linha, seja qual for a fonte.

## FAQ

### O que é uma voz tipográfica?

A tipografia com que um Mark inicia todo design: uma fonte de exibição, uma de texto, um peso de exibição, o espaçamento e a caixa das letras.

### Posso mudar as fontes de um Mark?

Sim. Mude qualquer linha no Studio, aplique uma fonte de título e de texto a uma página inteira ou use as fontes do seu kit de marca. A voz do Mark é só o ponto de partida.

### Posso usar minhas próprias fontes no Gradiently?

Sim. Adicione uma fonte de título e uma de texto ao seu kit de marca, enviando os arquivos de fonte se for preciso.

### O que acontece com minhas fontes se eu colocar outro Mark em um design?

O texto que ainda segue a voz assume a voz do novo Mark. As linhas às quais você deu uma fonte própria a mantêm.
