Ir a la herramienta
JoeLucky

Haz clic en ★ para guardar una herramienta

Categorías de herramientas

Código a imagenGenerador de degradados CSSGlassmorphism CSSGenerador de box-shadowGenerador de loaders CSSGenerador de blobs SVGSVG a PNGVerificador de contraste de colorConversor PX / REM / EM
JoeLucky

Herramientas en línea prácticas, todas en un solo lugar

Política de privacidadTérminos del servicio

© 2026 JoeLucky®. Todos los derechos reservados.

  1. JoeLucky
  2. /CSS y diseño
  3. /Generador de blobs SVG

Generador de blobs SVG

Genera formas orgánicas en SVG con complejidad ajustable.

CSS Y DISEÑO SIMILARES

Ver todas
Código a imagen

Convierte fragmentos de código en capturas de pantalla atractivas.

Abrir →
Generador de degradados CSS

Diseña degradados lineales, radiales y cónicos y copia el CSS al instante.

Abrir →
Glassmorphism CSS

💬 Comentarios

?

Aún no hay comentarios. ¡Sé el primero!

¿QUÉ ES Generador de blobs SVG?

Genera formas SVG orgánicas aleatorias (blobs) con complejidad, aleatoriedad y relleno ajustables —buenas para decoración de fondo o ilustración— y copia el SVG o un clip-path.

¿Cómo se usa?

  1. «Complejidad» (3–10) fija el número de puntos; más alto = más detalle. «Aleatoriedad» controla cuánto se desvían los puntos de un círculo perfecto — 0 es casi redondo, 100 es lo más irregular.
  2. Haz clic en los 6 círculos de color para elegir un degradado (Púrpura, Rosa, Cian, Ámbar, Rosa fuerte) o un relleno sólido — la vista previa se actualiza al instante.
  3. Elige entre 5 animaciones CSS (Ninguna, Pulse, Float, Wobble, Spin). El SVG exportado incorpora automáticamente el código @keyframes correspondiente.
  4. Haz clic en «Aleatorizar» para saltar al instante a una forma nueva. Cuando encuentres una que te guste, ajusta Complejidad y Aleatoriedad para afinarla.
  5. Cuatro opciones de exportación: «Copiar SVG» para el marcado completo, «Copiar clip-path» para enmascarar con CSS, descargar como vector SVG o como PNG de 800×800 px.

Preguntas frecuentes

¿Qué es el generador de SVG Blob?

Genera gráficos SVG orgánicos con forma de mancha suave, con color, complejidad y aleatoriedad personalizables.

¿Dónde se puede usar el SVG?

Insértalo en HTML/CSS o descárgalo e impórtalo en Figma, Illustrator, etc.

¿Cada clic genera una forma distinta?

Sí. Cada clic en Regenerar produce una forma de mancha aleatoria única.

Ajustes de la forma

Complejidad (puntos)6
Aleatoriedad50
Relleno
Animación CSS
Vista previa en vivo
Exportar

Genera en directo el código de desenfoque de fondo y borde translúcido.

Abrir →