---
url: "/pt/emailify/design/background-colors.md"
description: "Personalize o fundo das camadas de layout do Emailify aplicando preenchimentos do Figma a elas."
---

# Adicionar cores de fundo às camadas do layout

> Personalize o fundo das camadas de layout do Emailify aplicando preenchimentos do Figma a elas.

> **Tip:** Se você quer saber [como personalizar a cor de fundo externa do e-mail](/pt/emailify/design/background), que aparece em volta do corpo do e-mail, basta mudar o fundo da página no Figma. Ele será usado como cor de fundo do corpo do e-mail em todas as exportações HTML do Emailify.

## Definir uma cor de fundo sólida em qualquer camada do layout {#setting-a-solid-background-color-on-any-of-your-layout-layers}

[Video](/assets/videos/emailify/design/layout-background-color.mp4)

Para definir uma cor de fundo sólida em qualquer elemento de layout do design do e-mail, clique na camada no Figma, adicione um preenchimento (clicando no ícone **+** ao lado do painel **Fill** nas propriedades da camada no Figma) e defina o preenchimento **Solid** dessa camada. Ele será aplicado como cor de fundo CSS quando o e-mail for exportado para HTML pelo plugin.

## Definir um fundo em gradiente em uma camada Row, Column, Hero ou Wrapper {#setting-a-gradient-background-on-a-row-column-hero-or-wrapper-layer}

[Video](/assets/videos/emailify/design/layout-background-gradient.mp4)

Para definir um fundo em gradiente em qualquer elemento de layout Row, Column, Hero ou Wrapper do design do e-mail, clique na camada no Figma, adicione um preenchimento (clicando no ícone **+** ao lado do painel **Fill** nas propriedades da camada no Figma) e defina o preenchimento **Gradient** dessa camada. Ele será aplicado como imagem de fundo (e não como gradiente CSS, que tem [compatibilidade limitada](https://www.caniemail.com/features/css-linear-gradient/) entre os clientes de e-mail) quando o e-mail for exportado para HTML pelo plugin.

> **Warning:** Atenção: os fundos em gradiente são renderizados como [imagens de fundo](/pt/emailify/design/background-images). Eles funcionam em camadas Row, Column, Hero e Wrapper na pré-visualização e nas exportações HTML do Emailify, mas as exportações brutas `mjml` e `loops` ainda omitem os atributos de imagem de fundo das Columns.

## Definir uma cor de fundo sólida em camadas de texto {#setting-a-solid-background-color-on-text-layers}

[Video](/assets/videos/emailify/design/text-background.mp4)

Para definir uma cor de fundo sólida em camadas de texto do design do e-mail, selecione uma camada de texto do Figma no e-mail com o painel **Settings** aberto e cole o valor hexadecimal da cor (por exemplo, `#FFFBA8`) no campo **Text Background Color**. Isso adiciona automaticamente uma cor de fundo sólida atrás desse conteúdo de texto no seu e-mail HTML.

> **Tip:** Se quiser, você também pode combinar a cor de fundo da camada de texto com [um espaçamento interno na camada de texto](/pt/emailify/design/text-padding), o que cria um espaço extra em volta do conteúdo do texto e dá um respiro à área do fundo.