Baixe 6 padrões de fundo repetidos GRÁTIS para Divi
Publicados: 2018-09-06Dar ao seu site uma atenção extra aos detalhes pode influenciar seu estilo geral de design da web mais do que você pensa. Normalmente são os pequenos detalhes que ajudam as pessoas a distinguir um tipo de site de modelo de um personalizado.
Existem várias maneiras de atingir projetos elevados. Uma das coisas que você pode fazer é usar padrões sutis de repetição de plano de fundo para qualquer elemento de design em sua página. Isso não apenas ajuda a diminuir os tamanhos das imagens de fundo, mas também ajuda a preencher fundos em branco sem sobrecarregá-los.
Neste post, você poderá baixar 6 padrões de fundo básicos, porém versáteis, que você pode usar ao construir qualquer tipo de site com Divi. Esses padrões são ótimos para guardar no bolso quando você precisar incrementar seu design da web.
Antevisão
Vamos dar uma olhada no tipo de resultado que você pode alcançar em seu site usando estes padrões de fundo:
Baixe os padrões de fundo GRATUITAMENTE
Para colocar suas mãos sobre os padrões de fundo gratuitos, primeiro você precisa fazer o download usando o botão abaixo. Para obter acesso ao download, você precisará se inscrever em nossa lista de e-mail Divi Daily usando o formulário abaixo. Como um novo assinante, você receberá ainda mais bondade Divi e um pacote Divi Layout grátis toda segunda e sexta-feira! Se você já está na lista, basta inserir seu endereço de e-mail abaixo e clicar em download. Você não será “reinscrito” nem receberá e-mails extras.
Download de graça
Junte-se ao Divi Newsletter e nós lhe enviaremos por e-mail uma cópia do último pacote de layout de página de destino Divi, além de toneladas de outros recursos, dicas e truques Divi incríveis e gratuitos. Acompanhe e você será um mestre Divi em nenhum momento. Se você já está inscrito basta digitar seu endereço de e-mail abaixo e clicar em download para acessar o pacote de layout.
Você se inscreveu com sucesso. Por favor, verifique seu endereço de e-mail para confirmar sua assinatura e tenha acesso a pacotes de layout Divi semanais gratuitos!
Abordagem
- Depois de baixar a pasta e descompactá-la, você encontrará 5 pastas diferentes
- Cada uma dessas pastas representa um conjunto de dimensões diferente: 1000 × 1000, 500 × 500, 100 × 100, 50 × 50 e 25 × 25
- Embora esses sejam tecnicamente os mesmos padrões, o resultado final em seu site será diferente, dependendo do conjunto de dimensões que você decidir usar
- Estamos combinando esses padrões com as opções de fundo do Divi para criar o efeito de repetição de fundo
- Isso não apenas manterá sua imagem de fundo consistente, mas também diminuirá a necessidade de imagens de fundo de alta resolução
Como funciona
Escolha uma seção em sua página
Você pode aplicar esses padrões de fundo a qualquer elemento de design em sua página. Vamos demonstrar isso adicionando como plano de fundo da seção. Mas sinta-se à vontade para adicionar esses mesmos padrões a outros elementos de design, como linhas, colunas e módulos. Quanto menor for o seu elemento de design, menor você precisará para ir com a dimensão do seu padrão, dependendo de como você deseja que a aparência fique.
Escolha suas dimensões preferidas
Padrão 1: 1000 × 1000
Configurações de fundo
Para alcançar o resultado que compartilhamos acima, vá em frente e localize o padrão # 1 na pasta 1000 × 1000 do seu download. Em seguida, carregue-o nas configurações de plano de fundo da seção e use as seguintes configurações com ele:
- Tamanho da imagem de fundo: tamanho real
- Posição da imagem de fundo: centro
- Repetição da imagem de fundo: repetir
Com Gradient Overlay
Quer misturar o padrão usando fundos gradientes? Você também pode fazer isso. No exemplo abaixo, usamos uma cor sólida e uma semitransparente em combinação com a colocação do gradiente acima da imagem de fundo para criar o efeito de mesclagem.
- Cor 1: # E2E2E2
- Cor 2: rgba (255,255,255,0,37)
- Tipo de gradiente: Linear
- Direção do gradiente: 181deg
- Posição inicial: 7%
- Posição final: 35%
Padrão # 1 : 500 × 500
Configurações de fundo
Você também pode fazer o padrão aparecer apenas horizontalmente ou verticalmente usando as opções de plano de fundo integradas do Divi. Para o exemplo acima, usamos o arquivo de imagem de padrão de dimensões # 1 de 500 × 500. Depois de fazer o upload, combine-o com as seguintes configurações de fundo:
- Tamanho da imagem de fundo: tamanho real
- Posição da imagem de fundo: Centro superior
- Repetição da imagem de fundo: repetir X (horizontal)
Padrão # 2 : 500 × 500
Configurações de fundo
Fizemos o mesmo usando o segundo padrão em sua pasta 500 × 500.
- Tamanho da imagem de fundo: tamanho real
- Posição da imagem de fundo: Centro superior
- Repetição da imagem de fundo: repetir X (horizontal)
Padrão # 3 : 100 × 100
Configurações de fundo
Para o próximo exemplo, localize o padrão nº 3 na pasta de dimensões 100 × 100 e combine-o com as seguintes opções de plano de fundo que farão com que o padrão ocupe toda a seção:
- Tamanho da imagem de fundo: tamanho real
- Posição da imagem de fundo: centro
- Repetição da imagem de fundo: repetir
Padrão # 4 : 50 × 50
Configurações de fundo
Quanto menores forem as dimensões, maior será a frequência do padrão. Localize o fundo # 4 na pasta de dimensões 50 × 50 e combine-o com as seguintes configurações de fundo:
- Tamanho da imagem de fundo: tamanho real
- Posição da imagem de fundo: Centro superior
- Repetição da imagem de fundo: repetir
Padrão # 5 : 100 × 100
Configurações de fundo
O quinto padrão oferece um design impressionante e sutil quando você usa o conjunto de dimensões 100 × 100 com as seguintes configurações de fundo:
- Tamanho da imagem de fundo: tamanho real
- Posição da imagem de fundo: Centro superior
- Repetição da imagem de fundo: repetir
Padrão # 6 : 25 × 25
Configurações de fundo
Por último, mas não menos importante, localize o padrão # 6 na pasta de dimensões 25 × 25 e carregue-o para o plano de fundo da sua seção junto com as seguintes configurações de plano de fundo:
- Tamanho da imagem de fundo: tamanho real
- Posição da imagem de fundo: Centro superior
- Repetição da imagem de fundo: repetir
Use padrões para planos de fundo de linha, coluna e módulo também
Os exemplos que tratamos acima são apenas algumas das opções que você tem. Você obterá um resultado diferente para cada padrão se experimentar as diferentes dimensões incluídas. Além disso, você também pode usar as opções de plano de fundo do Divi para criar vários resultados. Você não está limitado a usar esses padrões de fundo apenas para seções. Você pode usá-los para todos os elementos de design do Divi's Visual Builder. O tamanho do seu padrão deve corresponder ao tamanho do seu elemento. Use os padrões para planos de fundo de linha, coluna e módulo para criar designs personalizados e exclusivos.
Antevisão
Agora que lidou com alguns resultados finais diferentes que você pode obter com os padrões de fundo, vamos dar uma olhada final no resultado final:
Pensamentos finais
Em web design, é importante prestar atenção aos detalhes. Há muitas maneiras de fazer isso, mas neste post, tratamos especificamente do uso de padrões de fundo para obter fundos sutis para elementos de design usando Divi. Fornecemos 6 padrões diferentes que você pode baixar e usar gratuitamente. Para cada um dos padrões, também fornecemos dimensões diferentes que levam a resultados diferentes, uma vez usados em uma página. Se você tiver dúvidas ou sugestões, deixe um comentário na seção de comentários abaixo!