Herramientas de Cálculo en Línea
Español

Generador de Degradados CSS

Crea degradados lineales o radiales visualmente y exporta código CSS.

Tipo de Degradado
Ángulo135°
Controles de Color
Color de Inicio
#3B82F6
Color de Fin
#EF4444
CSS Output
background: linear-gradient(135deg, #3b82f6, #ef4444);
Vista Previa

Guía de Uso

  • Elija entre el tipo de degradado 'Lineal' o 'Radial'.
  • Establezca los colores de inicio y fin, y podrá observar los cambios de transición en el medio.
  • Para degradados lineales, puede ajustar el ángulo de rotación mediante el deslizador.
  • Una vez satisfecho, haga clic en el botón 'Copiar CSS de Degradado' para aplicar el estilo generado a su proyecto.

Conocimiento de Degradado CSS

¿Qué son los degradados CSS?

Los degradados CSS son una variante del tipo de datos `<image>` que permite mostrar transiciones suaves entre dos o más colores especificados en el fondo.

Lineal vs. Radial

Los degradados lineales transicionan suavemente a lo largo de una línea recta, mientras que los degradados radiales se extienden hacia afuera desde un punto (usualmente el centro) en forma circular o elíptica.