Una delle novità di CSS3 è il supporto per gli sfondi gradienti. Sebbene i gradient non siano più molto di moda nel web, esistono situazioni in cui possono tornare gradevoli e per questo motivo si è deciso di inserirne il supporto nativo. Qui sotto vediamo un esempio di utilizzo di questa tecnica.

#gradient {
  background: -webkit-linear-gradient(left, #fff, #000);
  background: -moz-linear-gradient(left, #ff,f #000);
  background: -ms-linear-gradient(left, #fff, #000);
  background: -o-linear-gradient(left, #fff, #000); 
  background-color: #b5b5b5; 
}

Come si vede, la proprietà su cui agire è background all'interno della quale andiamo a impostare l'attributo linear-gradient (con i prefix dei vari vendor). In questo caso diciamo allo sfondo di iniziare da sinistra con un colore bianco e di procedere verso destra sfumando verso il nero. Nel caso i gradient non siano supportati dal browser, usiamo la proprietà background-color come default.