Diseño / SVG
Generador de blobs SVG (formas orgánicas aleatorias)
Crea formas de blob suaves y aleatorias para fondos e ilustraciones: elige cuántos puntos tendrán y su nivel de aleatoriedad, selecciona un color o un degradado de dos colores y descarga o copia el SVG.
Generador de blobs SVG (formas orgánicas aleatorias): Los puntos se distribuyen uniformemente alrededor de un círculo y cada uno se desplaza hacia el centro una cantidad aleatoria; después se unen mediante una curva cerrada y suave. Pocos puntos y mucha aleatoriedad producen formas irregulares; muchos puntos y poca aleatoriedad generan formas suaves y casi redondas. Funciona al 100 % en tu navegador, sin subir archivos a ningún servidor.
- Categoría
- Herramientas de desarrollo
- Se ejecuta
- En tu navegador
- Coste
- Gratis · sin registro
- Disponibilidad
- Lista para usar
Funciona por completo en tu navegador
SVG
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 400 400" width="400" height="400"><path d="M359.5,200 C360.7,243.5 315.4,319 278.8,336.4 C242.1,353.9 174.7,327.5 139.5,304.7 C104.4,282 69.5,237.5 68,200 C66.4,162.5 96.4,100.3 130.4,79.5 C164.4,58.7 233.7,55.4 271.9,75.5 C310.1,95.6 358.4,156.5 359.5,200 Z" fill="#63c42d"/></svg>
Los puntos se colocan de manera uniforme alrededor de un círculo, cada uno se desplaza hacia el centro una cantidad aleatoria y todos se unen mediante una curva cerrada y suave. Menos puntos y más aleatoriedad producen formas más irregulares; con un 0% de aleatoriedad se obtiene un círculo. Las formas orgánicas crean fondos suaves para fotos, iconos y encabezados.
Usos
Los blobs crean fondos suaves detrás de fotos de productos, iconos, avatares y encabezados. Detrás del texto, usa un color pálido o un relleno con poca opacidad para que el texto conserve el contraste; para ver el blob detrás del vidrio esmerilado, combínalo con el generador de glassmorphism.
Edición
El resultado es un único trazado con curvas cúbicas de Bézier, por lo que se abre en cualquier editor vectorial. Para cambiar algunos puntos manualmente, pégalo en el editor de SVG.
Cómo se usa
- Elige el número de puntos y el nivel de aleatoriedad.
- Selecciona un color o un degradado.
- Haz clic para crear nuevos blobs hasta encontrar uno que te guste; después descarga o copia el SVG.
Privacidad y límites
Las formas se dibujan en tu navegador.
Herramientas relacionadas
Preguntas frecuentes
¿Cómo puedo poner una foto dentro de un blob?
Copia el trazado y úsalo en un clipPath de SVG, o guarda el blob y úsalo como mask-image de CSS sobre la foto.
¿Puedo animar un blob?
Sí: genera dos blobs con el mismo número de puntos y anima entre ellos el atributo d del trazado; si el número de puntos coincide, la transformación será suave.
¿Hay un límite de tamaño?
El SVG mide 400 × 400, pero se puede escalar a cualquier tamaño sin perder nitidez.
Herramienta gratuita · se ejecuta en tu navegador · sin cuenta