Todas las herramientas › Generadores
Generador CSS: degradados, sombras, animaciones
Siete editores visuales con código listo: degradados, sombras, neumorfismo, blobs, cristal, animaciones y curvas de suavizado con resorte.
Qué puede hacer la herramienta
- Degradados con interpolación en OKLCH y OKLab: el centro de la transición no se enturbia, como ocurre con la mezcla habitual en sRGB.
- El modo «suavizar transiciones» añade colores intermedios y en los degradados anchos desaparecen las bandas visibles.
- Sombra inteligente de varias capas: varias capas con desplazamiento creciente se ven más suaves y naturales que una sola sombra.
- Neumorfismo: formas cóncava, convexa y hundida, con los colores de luz y sombra calculados a partir del color de fondo.
- Blobs: ocho valores de border-radius, formas aleatorias y una animación de transformación entre dos de ellas.
- Curva de suavizado arrastrando, además de resorte y pelota que rebota como función linear(): los editores estándar no lo tienen.
El código listo se copia con un botón. Si su navegador no entiende alguna variante (por ejemplo, la mezcla en OKLCH en una versión antigua), la vista previa se lo indicará, mientras que el código seguirá siendo correcto para los navegadores modernos.
Vea las animaciones y las curvas en la vista previa en vivo: el botón «Ejecutar» reproduce el movimiento de nuevo.