Generador de patrones SVG
Patrones de fondo sin costuras en segundos.
Elige un patrón, tamaño y colores para generar un fondo SVG repetible. Copia el código SVG o descarga el archivo para usarlo en sitios, apps o herramientas de diseño.
Patrón
24px
Color del patrón
Fondo
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"> <rect width="24" height="24" fill="#f5f3ff" /> <circle cx="12" cy="12" r="2.4" fill="#7c3aed" /> </svg>
Cómo generar patrones SVG
- Elige un tipo de patrón como puntos, cuadrícula u olas.
- Ajusta el tamaño de la tesela con el deslizador.
- Elige el color del patrón y el de fondo.
- Copia el código SVG o descarga el archivo .svg.
Preguntas frecuentes
¿Estos patrones son sin costuras?
Sí. Cada tesela está diseñada para repetirse sin juntas visibles al usarse como fondo CSS.
¿Cómo uso el patrón en mi sitio?
Referencia el archivo SVG descargado en tu CSS con background-image: url(pattern.svg), o incrusta el SVG copiado directamente en tu marcado.
¿Puedo editar el SVG después?
Por supuesto. La salida es texto SVG plano que puedes abrir en cualquier editor o aplicación de diseño.