Gerador de Blobs SVG
O gerador de blob SVG cria formas orgânicas aleatórias a partir de curvas Bézier cúbicas suaves, com controles de complexidade, aleatoriedade, tamanho, cor de preenchimento e gradiente opcional, e exporta o código ou o arquivo SVG.
Sobre esta ferramenta
O gerador de blob SVG cria formas orgânicas aleatórias a partir de curvas Bézier cúbicas suaves, com controles de complexidade, aleatoriedade, tamanho, cor de preenchimento e gradiente opcional, e exporta o código ou o arquivo SVG.
Como usar
- Defina a complexidade (número de pontos) e a aleatoriedade.
- Escolha o tamanho e a cor de preenchimento, ou ative um gradiente.
- Clique em Gerar novamente até gostar da forma.
- Copie o código SVG ou baixe o arquivo .svg.
Bom saber
- Cada blob é um único path SVG construído a partir de pontos ao redor de um círculo, ligados por curvas Bézier cúbicas.
- Mais pontos geram um contorno mais complexo; mais aleatoriedade o deixa menos circular.
- Blobs SVG ficam nítidos em qualquer tamanho e têm só algumas centenas de bytes.
- Blobs são populares como decoração de fundo, molduras de avatar e divisores de seção.
- O SVG pode ser usado inline, como origem de uma tag img ou como fundo CSS.
Funciona inteiramente no seu navegador — nada do que você digita é enviado ou armazenado.
Perguntas frequentes
Como fazer uma forma blob?
Ajuste aqui a complexidade e a aleatoriedade e clique em Gerar novamente; cada clique desenha uma nova forma orgânica aleatória que você pode baixar como SVG.
Posso usar os blobs comercialmente?
Sim. As formas são geradas aleatoriamente no seu dispositivo, então você pode usá-las em qualquer projeto.
Como usar um blob SVG como fundo?
Salve o arquivo e referencie-o com background-image: url(blob.svg), ou cole o SVG inline e posicione-o atrás do seu conteúdo.
Posso animar um blob?
Sim: você pode girá-lo ou redimensioná-lo com CSS, ou fazer a transição entre dois paths com o mesmo número de pontos usando SMIL ou JavaScript.