SVG
Gratis, sin registro, funciona en tu navegador.
La versión simple: un elemento `<svg>` con un trazado por capa. Pégalo en tu marcado o descárgalo como archivo y trátalo como cualquier otro recurso. Esta es la exportación que hay que usar cuando puedes añadir un elemento a la página.
Una exportación de SVG, recortada a las primeras líneas
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 200"><path d="M100 38L153.69 69L153.69 131L100 162L46.31 131L46.31 69Z" fill="#4f46e5"/></svg>Lo que conviene saber
- Funciona en todas partes, sin ninguna advertencia de compatibilidad que merezca mencionarse.
- Cada capa es un `<path>` aparte, así que puedes reestilizarlas por separado después de pegarlas.
- Las ondas llevan `preserveAspectRatio="none"` para estirarse a cualquier ancho; los blobs mantienen sus proporciones.
- Sin comentarios del generador, sin marcas identificativas y sin enlaces de vuelta aquí.
Compatibilidad de navegadores
Universal. SVG lleva soportado en todos los navegadores contra los que alguien todavía prueba desde hace más de una década, y nada de esta salida usa una característica reciente: son trazados y rellenos.
Tamaño en todos los preajustes
Todos los preajustes que este formato puede expresar, medidos tal como los emite el generador. El más pequeño es Hexágono con 151 bytes; el mayor es Ondas en capas con 898 bytes. El número de puntos es lo que marca la diferencia: cada punto extra añade un segmento cúbico completo de coordenadas.
| Formato | Tamaño |
|---|---|
| Hexágono | 151 B |
| Cristal | 156 B |
| Gema facetada | 182 B |
| Triángulo redondeado | 217 B |
| Picos de montaña | 231 B |
| Barrido | 246 B |
| Zigzag marcado | 264 B |
| Onda profunda | 282 B |
| Guijarro | 294 B |
| Borde de nube | 295 B |
| Arcos recortados | 319 B |
| Onda suave | 322 B |
| Blob suave | 330 B |
| Escalones | 358 B |
| Festón | 382 B |
| Blob orgánico | 402 B |
| Destello | 408 B |
| Onda orgánica | 478 B |
| Onda de pie de página | 551 B |
| Estrella | 551 B |
| Flor | 557 B |
| Burbuja | 559 B |
| Borde pixelado | 579 B |
| Salpicadura | 641 B |
| Ondulación | 655 B |
| Ondas en capas | 898 B |
Con más detalle
El único atributo que merece la pena entender es `preserveAspectRatio`. En una onda está puesto a `none`, lo que permite que la forma se estire horizontalmente hasta el ancho que tenga su contenedor — eso es lo que hace que un mismo divisor funcione en un móvil y en un monitor panorámico sin bandas. En un blob se deja en paz, porque un blob estirado a la proporción de un contenedor no es más que una elipse con pasos de más.
Preguntas
¿Qué formas funcionan como SVG?
Este formato cubre Onda, Blob. Es una restricción real y no una limitación de esta herramienta: cuando falta un generador en esa lista, el formato realmente no puede expresarlo, y ofrecerlo de todos modos te entregaría algo que dibuja en silencio la forma equivocada.
¿Cuánto ocupa una exportación de SVG?
Entre 151 y 898 bytes en los 26 preajustes que lo admiten. Menos puntos es la palanca que importa; la suavidad y el color no cuestan nada.
¿Puedo editarlo a mano después?
Sí. La salida es texto plano sin comentarios del generador, sin marcas identificativas y sin enlaces de vuelta aquí. Cambia los colores, renombra la clase o pega el trazado en tu propio SVG: nada de lo que viene después depende de que siga igual.
Cada cifra y cada forma de esta página se produjeron ejecutando el generador durante la compilación, así que describen la herramienta que estás a punto de usar y no una versión que existió una vez.