header-logo
Confira como usar o Wix para construir seu site e negócio.
Personalize e gerencie seu site com os recursos do Wix.
Gerencie assinaturas, planos e faturas.
Administre seu negócio e conecte-se com os membros.
Compre, conecte ou transfira um domínio para o seu site.
Expanda seu negócio e presença online.
Aumente sua visibilidade com recursos de SEO e marketing.
Acesse recursos avançados e otimize sua produtividade.
Encontre soluções, problemas conhecidos ou contate-nos.
placeholder-preview-image
Domine novas habilidades com nossos cursos e tutoriais.
Confira nossas dicas de web design, marketing e mais.
Aumente o tráfego orgânico vindo dos motores de busca.
Desenvolva um site único com a nossa plataforma full-stack.
Alcance seus objetivos com a ajuda de um especialista.
placeholder-preview-image

Editor do Wix Studio: trabalhar com arte vetorial e formas básicas

5 min
Neste artigo
  • Adicionar arte vetorial e formas básicas
  • Fazer o design de arte vetorial e formas básicas
  • Ajustar as configurações de formas básicas e arte vetorial
  • Adicionar um link a formas básicas e arte vetorial
Melhore seu design com artes vetoriais e formas básicas impressionantes. Essas ilustrações e ícones dimensionáveis (SVGs) mantêm uma qualidade perfeita em qualquer tamanho, tornando-os ideais para sites responsivos. Explore a biblioteca de arte vetorial gratuita e as formas básicas do Wix Studio ou faça upload dos seus próprios SVGs para alinhá-los com a marca do seu cliente.
Dica:
Os arquivos de arte vetorial geralmente incluem várias cores, enquanto as formas básicas se concentram em uma única cor. No entanto, ambos são arquivos SVG. 

Adicionar arte vetorial e formas básicas

Você pode usar arte vetorial e formas básicas para decorar o site do seu cliente ou como um call to action atraente. Você pode escolher entre as centenas de opções gratuitas disponíveis no Wix Studio ou fazer upload da sua própria. 
Clique em uma das opções abaixo para saber mais:
A categoria arte vetorial no painel Elementos no Editor do Wix Studio, mostrando a arte vetorial gratuita do Wix

Fazer o design de arte vetorial e formas básicas

Personalize o elemento de arte vetorial/forma básica, incluindo as cores, opacidade e sombra, para que ele combine com seu design.
Observação:
As opções de personalização disponíveis dependem se a arte vetorial apresenta uma única cor, várias cores ou uma paleta de tons de cinza. 

Para personalizar o design:

  1. Vá para o seu editor.
  2. Selecione a arte vetorial ou o elemento de forma básica relevante.
  3. Clique no ícone Abrir inspetor  no canto superior direito do editor.
Uma captura de tela do painel Inspetor sendo aberto no Editor do Wix Studio.
  1. Faça o design da arte vetorial/forma básica usando as opções disponíveis:
    • Forma básica: altere a cor e a opacidade do preenchimento, adicione uma borda e aplique uma sombra. 
    • Arte vetorial: altere as cores de preenchimento, ajuste a opacidade e aplique uma sombra.
      Observação: não é possível alterar a opacidade separadamente para cada cor da arte vetorial.
Você fez upload do seu próprio SVG?
Se não conseguirmos identificar as cores no seu arquivo SVG, pode ser que você não consiga personalizar as cores no editor.
Arte vetorial - vaso com flores - com 6 cores na tela, ao lado das opções de design no Inspetor

Ajustar as configurações de formas básicas e arte vetorial

Ajuste a arte vetorial ou as configurações de forma básica como preferir. Você pode adicionar um link, tornar o elemento acessível com alt text ou defini-lo como decorativo se for apenas para fins de design. Além disso, você pode garantir que o elemento mantenha suas proporções originais quando redimensionado ou decidir que deseja que ele seja redimensionado livremente. 

Para ajustar as configurações:

  1. Vá para o seu editor.
  2. Selecione a arte vetorial ou o elemento de forma básica relevante.
  3. Clique no ícone Configurações .
  4. Escolha o que fazer a seguir:
    • Adicione um link para a arte vetorial/forma básica.
    • Decida se esse elemento precisa ou não de alt text:
      • O que há na imagem?: insira uma breve descrição do que você pode ver nessa arte vetorial ou forma básica, para ajudar os motores de busca e ferramentas de acessibilidade.
      • Esta imagem é decorativa: selecione essa opção se essa arte vetorial/forma básica não contiver informações importantes para leitores de tela, apenas para decorar a página.
    • Ative a alavanca Manter as proporções para garantir que as proporções originais do elemento sejam mantidas quando você o redimensiona.   
Elemento de arte vetorial na tela, ao lado do painel de configurações, selecionando para não adicionar alt text

Adicione um link para transformar o elemento em um botão ou call to action. Você pode vincular a muitos lugares, como uma página do site, um URL externo ou até mesmo um número de telefone. Inserir um link é uma ótima maneira de estimular a interação dos visitantes e deixar o site mais atrativo e funcional.

Para adicionar um link:

  1. Vá para o seu editor.
  2. Selecione a arte vetorial ou o elemento de forma básica relevante.
  3. Clique no ícone Link .
  4. Selecione o tipo de link na lista à esquerda.
  5. Insira as informações relevantes.
  6. Clique em Ok.
Elemento de arte vetorial: 2 caixas de presente, ao lado do painel Link, vinculando a uma página de categoria específica