1. 01Elige arriba la pestaña de esquinas redondeadas, clip-path, cubic-bezier o animaciones de carga.
2. 02En esquinas redondeadas, alterna entre «cuatro esquinas» y el modo elíptico de 8 valores, y ajusta el porcentaje horizontal o vertical de cada esquina, o aplica un preajuste.
3. 03En clip-path, arrastra los vértices del polígono, haz doble clic para borrar y usa el botón para añadir; en Bezier, arrastra los dos puntos de control y compara la animación con una transición lineal.
4. 04En la pestaña de animaciones, elige el color principal y copia el HTML + CSS de cualquiera de las 12 propuestas.

• Cada radio horizontal o vertical de las esquinas va de 0 a 100%, con 8 preajustes (círculo, hoja, gota, pétalo, etc.); «forma aleatoria» usa Math.random(), no el módulo criptográfico público Web Crypto.
• clip-path incluye 12 preajustes (triángulo, rombo, pentágono a octágono, estrella de cinco puntas, flecha, cruz, bocadillo, trapecio, etc.); se conservan al menos 3 vértices y los nuevos se insertan en el punto medio del lado más largo.
• Los dos valores x de cubic-bezier se fuerzan a 0–1 y la y puede ir de -0.5 a 1.5 para permitir anticipación y rebote; la vista previa de la animación dura 0.3–3 segundos y el ejemplo de código fija siempre una transición de 600ms.
• Hay 12 animaciones en total: anillo, doble arco, tres puntos, barras verticales, pulso, ondas, órbita, cuadrícula, barra de progreso, volteo y más; lo que se copia incluye a la vez HTML y CSS.
• Lo que no hace: no ejecuta CSS arbitrario del usuario, no es un editor visual de maquetación completo ni escribe archivos en tu proyecto.

Todos los parámetros CSS, las vistas previas y el código copiado se generan en la página del navegador; no se suben datos ni se ejecuta código remoto.