Herramientas gratuitas
Español
Generador de patrones SVG
Generador de patrones SVG — Elige tamaños o colores y revisa el código o resultado. Los datos de la herramienta quedan en tu dispositivo. Sin cuenta.
Sin cuenta
Cargando herramienta…
Cómo usar
- 1Introduce valores y elige las opciones.
- 2Ejecuta la herramienta y revisa el resultado.
- 3Copia el resultado o cambia los datos para comparar.
A tener en cuenta
Revisa rangos y unidades. Los resultados dependen de los datos y del navegador.
Los anuncios pueden procesar datos de conexión. La personalización respeta tus opciones de privacidad. Privacidad (inglés)
Ejemplo calculado de entrada y salida
Resultados del motor real con los valores de ejemplo, sin datos personales ni trabajos guardados. Carga el ejemplo en la herramienta para ver las mismas entradas.
Entrada de ejemplo
| Campo | Valor |
|---|---|
| Modo | Puntos |
| Color | #0F766E |
| Color de fondo | #FFFFFF |
| Espacio del patrón (px) | 24 |
| Grosor o radio del punto (px) | 2 |
Resultado de ejemplo
<svg xmlns="http://www.w3.org/2000/svg" width="400" height="400" viewBox="0 0 400 400"><defs><pattern id="p" width="24" height="24" patternUnits="userSpaceOnUse"><rect width="24" height="24" fill="#FFFFFF"/><circle cx="12" cy="12" r="2" fill="#0F766E"/></pattern></defs><rect width="400" height="400" fill="url(#p)"/></svg>
Requisitos de entrada
Estos son límites reales de validación, no una garantía de que todo valor aceptado sea realista o aplicable a tu caso.
- Modo: Opciones disponibles: Puntos / Rayas / Cuadrícula
- Espacio del patrón (px): Rango admitido: 4 ≤ x ≤ 200
- Grosor o radio del punto (px): Rango admitido: 0,1 ≤ x ≤ 20