Guijarro
Gratis, sin registro, funciona en tu navegador.
Cinco puntos con aleatoriedad moderada, lo que tiende a producir algo más cercano a un canto rodado que a una salpicadura. El blob más útil para cualquier cosa que deba leerse como un objeto sólido y no como un manchón decorativo.
Los ajustes que hay detrás
| Generador | Blob |
|---|---|
| Puntos | 5 |
| Aleatoriedad | 45% |
| Suavidad | 105% |
| Semilla | 404 |
Lo que conviene saber
- Cinco puntos dan una silueta de número impar, lo que evita la simetría accidental de seis.
- Aleatoriedad moderada: irregular, pero todos los lóbulos siguen siendo de tamaño parecido.
- La forma de aquí que más se acerca a lo que un border-radius CSS puede imitar, si prefieres no publicar un SVG.
Lo que cuesta en bytes
Esta forma exacta ocupa 294 bytes como SVG y 455 bytes como fondo CSS — el data URI es mayor porque la codificación en porcentaje cuesta tres caracteres por cada uno que escapa. Ambas cifras corresponden a la forma mostrada arriba, con dos decimales de precisión en las coordenadas.
| Formato | Tamaño |
|---|---|
| SVG | 294 B |
| Fondo CSS | 455 B |
| clip-path CSS | 512 B |
| border-radius CSS | 104 B |
El comienzo del SVG de Guijarro
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 200"><path d="M100 41.28C122.08 40.79,161.83 60.16,167.4 78.1C172.96 96.04,149.18 132.27,131.81 143.78C114.43 155.29,83.98 154.88,68.12 143.87C52.27 132.87,35.62 98.85,41.2 80.89C46.78 62.94,77.92 41.76,100 41.28Z" fill="#4f46e5"/></svg>Con más detalle
Un guijarro es el blob que más merece la pena comparar entre formatos de exportación. Como SVG es exacto; como border-radius es una aproximación con cuatro esquinas, que no puede reproducir cinco lóbulos y no debería fingir que sí. La salida de border-radius se ofrece como su propia forma y no como la misma forma en otro formato, porque presentarla de otro modo sería una mentira que solo descubres después de publicar.
Preguntas
¿Cómo cambio Guijarro una vez la tengo?
Abre el generador, pulsa Guijarro en la fila de preajustes y arrastra lo que quieras. El preajuste es un punto de partida, no un candado: todos los controles siguen activos, y la casilla de semilla acepta una palabra si prefieres nombrar tu forma en vez de numerarla.
¿Se verá igual la próxima vez?
Sí, siempre que la semilla sea la misma. Esta es la semilla 404 con 5 puntos. El generador es determinista, así que esos ajustes reproducen esta curva exacta en cualquier dispositivo.
¿Puedo usar otro color?
Sí — el color se aplica al exportar, no está incrustado en la geometría. La vista previa de arriba usa el color por defecto; elige el tuyo en el generador y el SVG, el fondo CSS y el clip-path lo seguirán.
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.