CSS: Gradients
CSS gradients let you display smooth transitions between two or more specified colours.
Here is a useful CSS Gradient Generator – https://cssgradient.io
2 Colours – Vertical
![](http://cdn-5bbe9373f911c8130c30e7f4.closte.com/wp-content/uploads/sites/2/2018/10/wpchunks-css-gradients-vertical.jpg)
background: rgb(0,0,0); background: -moz-linear-gradient(0deg, #000000 0%, #FFFFFF 100%); background: -webkit-linear-gradient(0deg, #000000 0%, #FFFFFF 100%); background: linear-gradient(0deg, #000000 0%, #FFFFFF 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#ffffff",GradientType=1);
2 Colours – Horizontal
![](http://cdn-5bbe9373f911c8130c30e7f4.closte.com/wp-content/uploads/sites/2/2018/10/wpchunks-css-gradients-horizonal.jpg)
background: rgb(0,0,0); background: -moz-linear-gradient(90deg, #000000 0%, #FFFFFF 100%); background: -webkit-linear-gradient(90deg, #000000 0%, #FFFFFF 100%); background: linear-gradient(90deg, #000000 0%, #FFFFFF 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#ffffff",GradientType=1);