Gerador de formas SVG
- Os arquivos não saem do seu dispositivo
- Roda no navegador
- Grátis, sem cadastro, sem marca d’água
Press R or Space for a new blob.
Como usar Gerador de formas SVG
Gere formas orgânicas aleatórias e exporte-as como SVG, PNG ou um componente React. Ajuste pontos, contraste, camadas, preenchimento em degradê e estilo do contorno e acrescente uma animação de morph opcional. Cada forma vem de um número de semente e é gerada no seu navegador.
- 1
Clique em Nova forma, ou pressione R ou Espaço, até gostar da forma. Formas anteriores ficam em Formas recentes.
- 2
Em Forma, ajuste Complexidade, Contraste, Tamanho e Camadas.
- 3
Em Cor, escolha uma das Paletas ou defina um preenchimento Sólido ou Degradê, e mude Estilo para Contorno se quiser só a borda.
- 4
Defina a Largura e a Altura da tela, ative Cor de fundo se precisar e habilite Animação de morph para uma forma em movimento.
- 5
Clique em Baixar SVG, ou escolha uma escala PNG de 1×, 2× ou 4× e clique em PNG. Copiar SVG e Copiar React colocam o código na área de transferência.
Perguntas frequentes
Posso obter a mesma forma depois?
Sim. A forma vem da Semente, então a mesma semente com as mesmas configurações sempre dá a mesma forma. Anote o número e digite-o de volta em Semente.
O fundo é transparente?
Sim, por padrão. Ative Cor de fundo só se quiser uma tela preenchida.
A animação funciona no arquivo exportado?
A animação de morph usa o elemento animate nativo do SVG, então toca nas exportações SVG e React sem CSS ou JavaScript extra. O PNG é sempre um quadro parado.
Como uso a forma em um projeto React?
Copiar React dá um componente que devolve o SVG e passa as props ao elemento svg, para você acrescentar className ou style.
Algo é enviado?
Não. As formas são calculadas e exportadas inteiramente no seu navegador.