Arcos recortados
Gratis, sin registro, funciona en tu navegador.
El festón invertido: los arcos se curvan hacia dentro del área de color en vez de hacia fuera, dejando una hilera de aberturas en arco a lo largo del borde. Arquitectónico más que decorativo, y la elección obvia para cualquier cosa con aire de columnata o galería.
Los ajustes que hay detrás
| Generador | Onda |
|---|---|
| Puntos | 6 |
| Amplitud | 62% |
| Aleatoriedad | 0% |
| Línea base | 50% |
| Capas | 1 |
| Suavidad | 100% |
| Semilla | 302 |
Lo que conviene saber
- Los arcos barren al revés, lo que es una casilla de verificación y no una forma distinta.
- Seis arcos está cerca del límite antes de que las aberturas queden demasiado estrechas para leerse.
- Con 319 bytes cuesta lo mismo que la versión hacia fuera.
Lo que cuesta en bytes
Esta forma exacta ocupa 319 bytes como SVG y 480 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 | 319 B |
| Fondo CSS | 480 B |
| clip-path CSS | 511 B |
El comienzo del SVG de Arcos recortados
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 320" preserveAspectRatio="none"><path d="M-240 160A120 75.39 0 0 0 0 160A120 75.39 0 0 0 240 160A120 75.39 0 0 0 480 160A120 75.39 0 0 0 720 160A120 75.39 0 0 0 960 160A120 75.39 0 0 0 1200 160A120 75.39 0 0 0 1440 160L1440 320L-240 320Z" fill="#4f46e5"/></svg>Con más detalle
Los arcos hacia dentro y hacia fuera son el mismo comando de arco con la bandera de barrido invertida, y por eso esto es una casilla y no una familia de preajustes aparte. También es por lo que ambos cuestan los mismos bytes: nada del trazado cambia salvo un solo dígito.
Preguntas
¿Cómo cambio Arcos recortados una vez la tengo?
Abre el generador, pulsa Arcos recortados 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 302 con 6 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.