Permite mostrar transiciones suaves entre los dos o más colores.
CSS3 define dos tipos de gradientes:
- Los gradientes lineales (va hacia arriba / abajo / izquierda / derecha / diagonal)
repeating-linear-gradient
background: linear-gradient(direccion, color1, color2...);
- Gradientes radiales (definido por su centro)
repeating-radial-gradient
background: linear-gradient(angulo, color1, color2);
Ejemplos:
Gradiente lineal - de arriba a abajo (esto es por defecto)
Gradiente Lineal - De izquierda a derecha
Gradiente Lineal – Diagonal
Gradiente Lineal-Multiple