A seleção de fontes ajuda a transmitir a identidade de sua marca e a melhorar a legibilidade de seus e-mails. A Brevo permite que você escolha entre uma variedade de opções de fontes para ajudá-lo a criar e-mails bonitos que repercutam no seu público e aumentem o reconhecimento da sua marca.

Quais fontes podem ser usadas no design do meu e-mail?

Ao projetar seu e-mail, você pode usar:

Uma fonte segura da Web é uma fonte que provavelmente estará disponível na grande maioria dos dispositivos dos usuários. Fontes seguras podem ser usadas como fontes de reserva caso as fontes selecionadas originalmente não sejam compatíveis com o dispositivo do destinatário. Ao escolher fontes seguras como fontes de reserva, é possível evitar o risco de problemas de renderização de fontes e garantir que seus e-mails mantenham o impacto, independentemente do dispositivo em que forem lidos.

O Google Fonts é uma biblioteca de fontes gratuitas e de código aberto fornecida pelo Google que pode ser baixada para ser usada em seus diferentes projetos digitais. As fontes do Google são compatíveis com os seguintes clientes de e-mail:

Apple Mail
iOS Mail
Google Android

Samsung Mail (Android 8.0)
Outlook para Mac
App do Outlook

A Brevo permite que você use suas próprias fontes no editor de e-mail para criar e-mails com a identidade da sua marca, garantindo a consistência e o reconhecimento da marca em todos os seus canais de comunicação.

Para usar uma fonte personalizada no editor de e-mail da Brevo, você pode:

🌐 Usar uma fonte de sites públicos

Procure e selecione uma fonte em uma biblioteca de fontes de um site público, como a API das fontes do Google ou do Adobe. Depois de selecionar uma fonte, copie o link para o arquivo CSS da fonte. Esse link contém os estilos e as variações da fonte e deve ser semelhante a:

https://fonts.googleapis.com/css2?family=Your+Font+Name:ital,wght@0,100;1,200&display=swap
ou
https://use.typekit.net/xxxxxxx.css

💻 Usar uma fonte de um arquivo CSS hospedado no seu próprio servidor

❗️ Importante

Caso não tenha certeza de como realizar as etapas abaixo, peça ao desenvolvedor da Web que forneça o link para o arquivo CSS que contém a fonte personalizada e certifique-se de que o arquivo siga a regra @font-face.

Para usar uma fonte personalizada de um arquivo CSS:

Carregue o arquivo contendo a fonte personalizada em um dos diretórios do servidor. Os arquivos de fontes personalizadas geralmente estão em formato .woff, .woff2, ou .ttf .
Certifique-se de que ele seja acessível a partir de um URL direto, como https://yourserver.com/fonts/your-custom-font.woff2.

Crie um arquivo CSS usando a regra @font-face e adicione o link para o arquivo de fonte personalizada acima em url. Por exemplo:

@font-face {
font-family: 'Your Custom Font'; 
src: url('https://yourserver.com/fonts/your-custom-font.woff2') format('woff2'); 
font-weight: normal; 
font-style: normal;
}

Carregue o arquivo CSS em um dos diretórios do servidor.
Com base no seu domínio e no local do arquivo CSS, recupere o URL do seu arquivo CSS.
Por exemplo, se o seu domínio for thegreenyoga.com, o seu arquivo CSS estiver localizado no diretório css e o nome do arquivo CSS for thegreenyoga-font, o URL do arquivo CSS deve ser: https://thegreenyoga.com/css/thegreenyoga-font.css

Depois de copiar o link para o arquivo CSS contendo a fonte personalizada, siga o procedimento ➕ Add a custom font (Adicionar uma fonte personalizada) abaixo. O link deve estar em um formato http://.

💡 É bom saber

As fontes importadas do Google e as fontes personalizadas podem não ser compatíveis com todos os clientes de e-mail, navegadores ou sistemas. Recomendamos que você configure fontes de reserva para substituir as fontes personalizadas e do Google não suportadas em alguns dispositivos.

Antes de começar

Configure sua Biblioteca de marca para que cada novo modelo selecionado herde as propriedades de sua marca, como logotipo, cores, fontes e links de mídia social. Para saber mais, consulte nosso artigo dedicado Crie automaticamente seus e-mails com os ativos de sua marca usando a Biblioteca de marca.

🔤 Adicionar fontes ao editor de e-mail

Ao projetar seu e-mail, as fontes seguras são exibidas por padrão nas listas suspensas de seleção de fontes. No entanto, você pode adicionar e misturar todos os tipos de fontes (Google, Safe e fontes personalizadas). Você também pode configurar fontes de reserva para serem usadas nos cabeçalhos e parágrafos se as fontes selecionadas originalmente não forem compatíveis com o dispositivo dos destinatários.

Para adicionar e configurar fontes:

No editor de e-mail, clique em Style (Estilo) na barra lateral esquerda e role para baixo até a seção Text styles (Estilos de texto).
No menu suspenso Parágrafo, selecione o estilo ao qual você quer adicionar uma fonte.
No menu suspenso Font (Fonte), selecione a fonte que você quer usar entre as fontes padrão.
Se você quiser adicionar uma fonte personalizada, adicione fontes do Google ou personalizadas clicando em Manage web fonts (Gerenciar fontes da Web). Você é redirecionado para a página Manage web fonts (Gerenciar fontes da web) onde você pode:
🖱️ Selecionar as fontes do Google

Na guia Google Fonts, clique no menu suspenso Fonts e selecione a(s) fonte(s) que deseja usar na lista existente ou digite o nome de uma fonte para pesquisá-la na biblioteca do Google Fonts:
➕ Adicionar uma fonte personalizada
1. Acesse a aba Fonte personalizada.
2. No campo Custom font link (Link da fonte personalizada), cole o URL da fonte que você quer usar.
  ➡️Para saber mais sobre como recuperar o URL da sua fonte, verifique as informações na guia Custom font (Fonte personalizada) em Quais fontes podem ser usadas no design do meu e-mail?.
3. No menu suspenso Nome da fonte, exibimos automaticamente os nomes definidos no arquivo CSS em que a fonte está salva.
4. Clique em Add font (Adicionar fonte).
⛑️ Adicionar fontes reservas

Acesse a guia Fallback fonts e selecione a(s) fonte(s) de reserva que você deseja usar para seus cabeçalhos e outros textos, caso suas fontes personalizadas não sejam suportadas pelo cliente de e-mail do(s) destinatário(s).

🎉 Agora, você pode selecionar a(s) fonte(s) que adicionou em qualquer lista suspensa de seleção de fontes no editor de e-mail e aplicá-la(s) a qualquer texto do e-mail:

✍️ Editar ou excluir uma fonte

Para editar as fontes que você adicionou:

No editor de e-mail, clique em Style (Estilo) na barra lateral esquerda e role para baixo até a seção Text styles (Estilos de texto).
No menu suspenso Font, clique em Manage web fonts (Gerenciar fontes da web) para editar ou excluir suas fontes:
Fonte do Google Fonte personalizada Fontes de reserva

Clique no ícone de cruz para remover as fontes do Google que você não deseja mais ter nas suas listas suspensas de seleção de fontes.
- Desmarque as fontes personalizadas que você não deseja mais ter nas listas suspensas de seleção de fontes.
- Clique no ícone Edit (Editar) para editar o link ou o nome da fonte personalizada.
- Clique no ícone de Lixeira para excluir permanentemente a fonte personalizada do editor de e-mail.
Nas listas suspensas, selecione outra fonte para substituir a fonte de reserva que você selecionou originalmente.

⏭️ O que vem a seguir?

🤔 Dúvidas?

Em caso de dúvida, sinta-se à vontade para entrar em contato com nossa equipe de suporte, criando um tíquete a partir da sua conta. Caso ainda não tenha uma conta, entre em contato conosco aqui.

Se você está procurando ajuda com um projeto usando o Brevo, podemos encontrar à agência parceira da Brevo certa.

Adicionar fontes do Google, personalizadas e de reserva ao design de seu e-mail

Quais fontes podem ser usadas no design do meu e-mail?

Antes de começar

🔤 Adicionar fontes ao editor de e-mail

✍️ Editar ou excluir uma fonte

⏭️ O que vem a seguir?

🤔 Dúvidas?

💬 Este artigo foi útil?

Pesquisa

Adicionar fontes do Google, personalizadas e de reserva ao design de seu e-mail

Quais fontes podem ser usadas no design do meu e-mail?

Antes de começar

🔤 Adicionar fontes ao editor de e-mail

✍️ Editar ou excluir uma fonte

⏭️ O que vem a seguir?

🤔 Dúvidas?

💬 Este artigo foi útil?