Use a ferramenta Pano de fundo para desenhar um elemento e aplicar efeitos de filtro CSS à área atrás dele.
Esse recurso está disponível somente para anúncios gráficos e em vídeo.
Os elementos do pano de fundo precisam ser pelo menos parcialmente transparentes para que o efeito do filtro fique visível. Por padrão, novos elementos de pano de fundo são criados com um nível de opacidade 0,5. É possível mudar esse nível para ajustar a intensidade do efeito de filtro do pano de fundo.
Para adicionar um elemento de pano de fundo, siga estas etapas:
- Selecione a forma do elemento do pano de fundo clicando e mantendo pressionada a ferramenta Pano de fundo na barra de ferramentas até um menu pop-up ser exibido:
- Retângulo
- Oval
- Polígono
- Defina opções adicionais para a forma do pano de fundo.
- Somente para formas retangulares: para cantos arredondados, defina o raio do canto na barra de opções na parte superior da ferramenta. Utilize o botão Manter idêntico para usar o mesmo raio em todos os quatro cantos.
- Somente para formas poligonais: selecione a forma que você quer na barra de opções na parte superior da ferramenta. Use a opção Formato livre para desenhar sua própria forma. Se você selecionar a opção Polígono regular, insira o número de lados desejado.
- Desenhe o elemento do pano de fundo.
- Segure a tecla Shift ao desenhar para restringir o elemento e para que ele tenha largura e altura iguais. A tecla Shift não afeta elementos de formato livre nem determinadas formas predefinidas que, em vez disso, serão desenhadas com lados iguais: triângulo, losango, pentágono, hexágono e estrela.
- Segure a tecla Alt para usar a posição inicial de desenho como o ponto central do elemento.
- Depois de desenhar um pano de fundo poligonal, será possível arrastar cada vértice para alterar a forma dele, mas não será possível mudar o número de lados.
- No painel Efeitos de CSS, configure o filtro do pano de fundo que você quer aplicar. Por padrão, o filtro de desfoque é adicionado a um novo elemento do pano de fundo. Os seguintes filtros estão disponíveis:
Lista de filtros do pano de fundo
DesfoqueAplica um desfoque ao plano de fundo.
Opções de configuração
- Raio: define o raio do desfoque, de 0 a 100 pixels.
Deixa o plano de fundo mais ou menos claro.
Opções de configuração
- Porcentagem: 0% deixa o plano de fundo preto, enquanto 100% o mantém inalterado. A porcentagem máxima é de 1.000%.
Ajusta o contraste do plano de fundo.
Opções de configuração
- Porcentagem: 0% torna o plano de fundo cinza, enquanto 100% o mantém inalterado. A porcentagem máxima é de 1.000%.
Adiciona uma sombra projetada ao plano de fundo. Esse efeito só será visível quando for combinado com outro filtro de pano de fundo, ou se o elemento pai for parcialmente transparente.
Opções de configuração
- Deslocamento X: é a distância horizontal até a sombra projetada, de -100 a 100 pixels.
- Deslocamento Y: é a distância vertical até a sombra projetada, de -100 a 100 pixels.
- Raio: é o desfoque da sombra, de 0 a 100 pixels.
- Cor: é a cor da sombra.
Converte o plano de fundo em escala de cinza.
Opções de configuração
- Porcentagem: 0% mantém o plano de fundo inalterado, enquanto 100% o deixa completamente em escala de cinza.
Ajusta as cores do plano de fundo.
Opções de configuração
- Ângulo: é o número de graus para girar em torno da paleta de cores, de 0 a 360°.
Inverte as cores do plano de fundo.
Opções de configuração
- Porcentagem: 0% deixa o plano de fundo inalterado, enquanto 100% inverte completamente as cores dele. Em 50%, ele é renderizado como cinza.
Muda a opacidade do plano de fundo. Esse efeito só é visível quando combinado com outro filtro de pano de fundo.
Opções de configuração
- Porcentagem: 0% torna o plano de fundo completamente transparente, enquanto 100% o mantém inalterado.
Satura o plano de fundo.
Opções de configuração
- Porcentagem: 0% torna o plano de fundo completamente não saturado, enquanto 100% o mantém inalterado. A porcentagem máxima é de 1.000%.
Converte o plano de fundo em sépia.
Opções de configuração
- Porcentagem: 0% mantém o plano de fundo inalterado, enquanto 100% o torna completamente sépia.
Adicionar outro filtro
Os elementos do pano de fundo podem ter vários filtros. Para adicionar outro filtro, siga estas etapas:
- Selecione o elemento do pano de fundo.
- No painel Efeitos de CSS, clique em Adicionar filtros de pano de fundo.
- Selecione o filtro que você quer aplicar.
Reordenar filtros
Se vários filtros forem definidos para o mesmo pano de fundo, eles serão aplicados na ordem em que aparecem no painel Efeitos de CSS.
Para reorganizar os filtros, faça o seguinte:
- Passe o cursor sobre o nome do filtro que você quer reordenar. Você verá três pontos .
- Usando os pontos como uma alça, arraste e solte o filtro até onde quiser colocá-lo no painel.
Ocultar um filtro
É possível ocultar um filtro para que o efeito dele não apareça no cenário, nas visualizações nem nos arquivos publicados.
Para ocultar um filtro, faça o seguinte:
- Passe o cursor sobre o nome do filtro.
- Clique no ícone Ocultar .
- Para mostrar o filtro novamente, clique no ícone Mostrar .
Não é possível editar os controles dos filtros ocultos.
Excluir um filtro
Para excluir um filtro, faça o seguinte:
- Passe o cursor sobre o nome do filtro.
- Clique no ícone Excluir .
Como editar elementos do pano de fundo
É possível editar elementos do pano de fundo diretamente no cenário ou usando o painel de propriedades.
Redimensionar um elemento do pano de fundo
Selecione o elemento do pano de fundo que você quer redimensionar. Depois faça o seguinte:
- Edite as propriedades de largura e altura no painel Propriedades.
- Use a ferramenta Seleção com a opção Controle de transformação ativada na barra de opções da ferramenta, na parte superior.
- Segure a tecla Shift ao arrastar os pontos para manter a proporção.
- Segure a tecla Alt (Windows) ou Option (Mac) enquanto arrasta para redimensionar o elemento sem mudar o ponto central.
Mudar a curvatura dos cantos de um elemento retangular do pano de fundo
Você pode mudar os cantos de um elemento retangular do pano de fundo para que fique quadrado ou arredondado e ajustar o raio da curvatura dos cantos arredondados.
- Selecione o elemento do pano de fundo.
- No painel Propriedades, ajuste o raio do canto em pixels ou em porcentagem. Definir o raio como 0 torna os cantos quadrados.
- Quando o botão Manter idêntico estiver ativo, o mesmo valor será aplicado a todos os quatro cantos. Desative o botão para configurar cada canto separadamente.
Mudar a forma de um elemento poligonal do pano de fundo
É possível ajustar a forma de um elemento poligonal do pano de fundo no cenário:
- Selecione o elemento poligonal do pano de fundo.
- Selecione a ferramenta Pano de fundo poligonal na barra de ferramentas. As alças serão exibidas em cada vértice.
- Arraste cada vértice até onde quiser.
- Segure a tecla Shift enquanto arrasta para mover o vértice em um único eixo (vertical ou horizontal).
Observação: não é possível mudar o número de lados de uma forma poligonal existente do pano de fundo.
Animar elementos do pano de fundo
A animação de elementos do pano de fundo está disponível apenas em documentos de vídeo.
É possível animar o tamanho, a posição e as propriedades de filtro de um elemento do pano de fundo.
Para elementos retangulares do pano de fundo, é possível animar cantos arredondados. No caso de elementos poligonais, você também pode animar a forma do elemento (mas não mudar o número de lados) reposicionando os vértices em um frame-chave.
Elementos do pano de fundo para layouts em vários tamanhos
Os layouts em vários tamanhos estão disponíveis apenas em anúncios gráficos.
Com os layouts em vários tamanhos, é possível substituir as propriedades do elemento do pano de fundo, incluindo propriedades de filtro, para tamanhos e intervalos de tamanho específicos. Também é possível mudar a forma de um elemento poligonal do pano de fundo.
Quando houver substituições no filtro do pano de fundo, o rótulo Filtros de pano de fundo no painel "Responsivo" será exibido em amarelo.
Assim como outros itens, só é possível adicionar ou excluir elementos do pano de fundo ao editar o documento de base.