User:RainbowJester/vector.css

.grad3 { background-color: #F07575; /* Show a flat color if gradient isn't supported (IE 9) */ background-image: -webkit-linear-gradient(top, hsl(0, 80%, 70%), #bada55); /* Chrome & Safari */ background-image: -moz-linear-gradient(top, hsl(0, 80%, 70%), #bada55); /* Old Firefox (3.6 to 15) */ background-image: -ms-linear-gradient(top, hsl(0, 80%, 70%), #bada55); /* Pre-release IE 10*/ background-image: -o-linear-gradient(top, hsl(0, 80%, 70%), #bada55); /* Old Opera (11.1 to 12.0) */ background-image: linear-gradient(to bottom, hsl(0, 80%, 70%), #bada55); /* Standard syntax; must be last */ }

.grad1 { background-color: violet; /* Show a flat color if gradient isn't supported (IE 9) */ background-image: -webkit-linear-gradient(left, red, orange, yellow, green, blue, indigo, violet); /* Chrome & Safari */ background-image: -moz-linear-gradient(left, red, orange, yellow, green, blue, indigo, violet; /* Old Firefox (3.6 to 15) */ background-image: -ms-linear-gradient(left, red, orange, yellow, green, blue, indigo, violet); /* Pre-release IE 10*/ background-image: -o-linear-gradient(left, red, orange, yellow, green, blue, indigo, violet; /* Old Opera (11.1 to 12.0) */ background-image: linear-gradient(to right, red, orange, yellow, green, blue, indigo, violet); /* Standard syntax; must be last */ }

.grad { background: pink; background-image: -webkit-linear-gradient(45deg, blue, red); }