---
url: "/pt/emailify/design/background-images.md"
description: "Adicione a camadas Row, Column, Wrapper e Hero imagens de fundo que funcionam em todos os clientes (inclusive o Outlook) com um preenchimento de imagem no Figma."
---

# Adicionar imagens de fundo aos layouts de e-mail

> Adicione a camadas Row, Column, Wrapper e Hero imagens de fundo que funcionam em todos os clientes (inclusive o Outlook) com um preenchimento de imagem no Figma.

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

Para adicionar uma imagem de fundo a qualquer camada Row, Column, Wrapper ou Hero do design do e-mail, clique na camada no Figma, clique no ícone **+** ao lado do painel **Fill** nas propriedades da camada no Figma e defina o tipo de preenchimento como **Image**. O exemplo acima mostra isso em uma camada Column, mas o mesmo fluxo também vale para as camadas Row, Wrapper e Hero. Esse preenchimento de imagem será aplicado como imagem de fundo quando o e-mail for exportado para HTML pelo plugin.

> **Tip:** Para aumentar o contraste entre a imagem de fundo e as camadas de conteúdo, adicione uma cor semitransparente extra por cima do preenchimento de imagem de fundo da camada (clicando no ícone **+** ao lado do painel **Fill** nas propriedades da camada no Figma), defina o novo preenchimento **Gradient** ou **Solid** com a cor que quiser e ajuste a porcentagem de opacidade do preenchimento (por exemplo, `35`).

> **Note:** Imagens de fundo e gradientes são compatíveis com camadas Row, Column, Wrapper e Hero na pré-visualização do Emailify e nas exportações renderizadas em HTML. Se você exportar a saída bruta `mjml` ou `loops`, os atributos de imagem de fundo das Columns ainda são omitidos.

## Definir uma cor sólida alternativa atrás da imagem de fundo {#setting-a-solid-fallback-color-behind-your-background-image}

[Video](/assets/videos/emailify/design/add-bg-fallback-color.mp4)

Se quiser adicionar uma cor alternativa personalizada atrás da imagem de fundo (visível enquanto a imagem carrega no cliente de e-mail do usuário ou se o cliente de e-mail bloquear inicialmente a exibição de imagens), adicione uma cor sólida extra aos **Fills** da camada Row, Column, Wrapper ou Hero com imagem de fundo clicando no botão de ícone **+**, defina a cor escolhida com opacidade de `100%` e arraste-a para o fim da lista de Fills (abaixo do preenchimento da imagem de fundo).