Como adicionar uma borda a uma imagem

Qualquer imagem de um template pode ter uma borda: uma imagem do produto, um logo ou uma imagem dos dados dos seus produtos. A borda acompanha os cantos arredondados da imagem e aparece do mesmo jeito no editor e em cada imagem gerada.

Adicionar uma borda

1. Selecione a imagem na tela ou no painel de camadas.
2. Abra a aba Estilo e role até Borda.
3. Marque a caixa de seleção. Uma borda nova começa preta e com 4 pixels de largura.
4. Escolha uma Cor e defina a Largura em pixels.

Uma imagem com uma borda escura arredondada, e as configurações de Raio de canto e Borda no editor

O seletor de cor também oferece cores tiradas da própria imagem de cada produto, para que a borda combine com cada produto que ela mostra.

Para remover a borda, desmarque a caixa de seleção. O Feedr guarda a cor e a largura, então a borda volta como estava quando você marca a caixa de novo.

Como a borda se encaixa em volta da imagem

A borda fica dentro do elemento de imagem, como a moldura de um quadro. A imagem diminui para dar espaço a ela, então a borda nunca cobre nenhuma parte da imagem.

• Ajuste da imagem. A borda envolve a imagem do jeito que ela aparece. Com Conter, ela se ajusta à própria imagem, não ao espaço vazio em volta. Com Cobrir e Preencher, a imagem ocupa todo o elemento, então a borda acompanha as bordas do elemento.
• Raio de canto. O raio arredonda a parte de fora da borda, e os cantos da imagem o acompanham por dentro.

Imagens sem fundo

Quando você mostra uma imagem com o fundo removido, a borda emoldura o retângulo da imagem, não o contorno do produto.

Um produto com o fundo removido, emoldurado por uma borda arredondada

Filtros e sombras

• Filtros: mudam só a imagem. Uma imagem desfocada ou em tons de cinza mantém a borda na cor que você escolheu.
• Sombra: a imagem e a borda projetam uma única sombra juntas.

Se uma imagem não puder ser mostrada para um produto, por exemplo porque o produto não tem imagem nessa posição, a borda dela também não aparece.