CSS Gradient Generator

Css Source Code

Code: 
 
 /* IE10+ */ background-image:

 -ms-linear-gradient(left, #00ff00 0%, #FF0000 100%);  

 /* Mozilla Firefox */ 

 background-image: -moz-linear-gradient(left, #00ff00 0%, #FF0000 100%);  

 /* Opera */

  background-image: -o-linear-gradient(left, #00ff00 0%, #FF0000 100%);  

 /* Webkit (Safari/Chrome 10) 

 */ background-image

 -webkit-gradient(linear, left top, right top, color-stop(0, #00ff00), color-stop(100, #FF0000)); 

 /* Webkit (Chrome 11+) */
 background-image: -webkit-linear-gradient(left, #00ff00 0%, #FF0000 100%);  

 /* W3C Markup */ 
background-image: linear-gradient(to right, #00ff00 0%, #FF0000 100%);

Gradient Options

Choose Gradient Style:
Gradient Direction:
bottom right
bottom
bottom left
right
left
 top right
top
top left

Gradient Stops

Start %:
%
 Start Color
End %:
%
 End Color
Add Stop