Degradados

<div id="prueba">
</div>
<div id="prueba2">
</div>
<div id="prueba3">
</div>
<div id="prueba4">
</div>
<div id="prueba5">
</div>
<div id="prueba6">
</div>
<h1>Hola que tal</h1>
div{
 display:inline-block;
 width:500px;
 height:300px;
 border: solid 2px grey;
 box-shadow: 20px -10px 10px orange;
 margin:20px;
}
#prueba{
 background:linear-gradient(rgba(30,90,90,0), rgba(30,90,90,1));
}
#prueba2{
 background:linear-gradient(45deg, red, blue,orange);
}
#prueba3{
 background:linear-gradient(to right,red, blue);
}
#prueba4{
 background:radial-gradient(red, blue);
}
#prueba5{
 background:radial-gradient(circle,red, blue);
}
#prueba6{
 background: radial-gradient(closest-side at 60% 55%, red, yellow, black);
}
h1{
 background-color:black;
 text-shadow: 0px 0px 10px rgba(255,255,255,0.6), 0px 0px 30px rgba(255,255,255,0.4), 0px 0px 50px rgba(255,255,255,0.3), 0px 0px 180px rgba(255,255,255,0.3);
 color: rgba(255,255,255,0);
}

Publicado por

Juan Pablo Fuentes

Formador de programación y bases de datos