Generador de patrón de fondo para hero
Genere un patrón geométrico repetitivo para decorar el fondo de una sección hero, un banner o una cabecera de sitio, con varios estilos y un color totalmente personalizable.
Cómo funciona
La herramienta construye un patrón SVG mediante un elemento <pattern> que se repite automáticamente por toda la superficie: usted solo dibuja una única celda del patrón (cruz, círculo, chevron…) y el SVG se encarga de repetirla sin cortes visibles, sea cual sea el tamaño final de la zona que cubrir.
¿Cómo integro este patrón directamente en mi sitio sin archivo de imagen?
Copie el código SVG generado y péguelo directamente en su HTML, o codifíquelo como data-URI para usarlo como background-image de CSS: el patrón se mantiene nítido en todas las resoluciones de pantalla y no requiere ninguna petición de red adicional para cargar una imagen independiente.
¿El patrón se adapta si cambio el tamaño de la sección hero?
Si utiliza el SVG como background-image con background-repeat: repeat, el patrón se repite automáticamente para cubrir todo el ancho de la sección, sea cual sea su tamaño real en la página, sin necesidad de regenerar el archivo.
Generación 100% local: el patrón SVG se calcula íntegramente en su navegador, sin enviar ningún dato a un servidor.