This is a powerful javascript css3 gradient generator that is compatible with firefox, internet explorer 7, ie8 to versions to ie 9, opera,netscape etc.
if you want to generate radial gradient use this css code below to get your radial color.
.radial {
background: #000000; /* fallback for non-supporting browsers */
background-image: -webkit-gradient(radial, center center, 0, center center, 141, from(black), to(white), color-stop(25%, blue), color-stop(40%, green), color-stop(60%, red), color-stop(80%, purple)); /* old WebKit Syntax */
background-image: -webkit-radial-gradient(center center, circle contain, black 0%, blue 25%, green 40%, red 60%, purple 80%, white 100%); /* New WebKit syntax */
background-image: -moz-radial-gradient(center center, circle contain, black 0%, blue 25%, green 40%, red 60%, purple 80%, white 100%);
background-image: -ms-radial-gradient(center center, circle contain, black 0%, blue 25%, green 40%, red 60%, purple 80%, white 100%); /* IE10+ */
background-image: -o-radial-gradient(center center, circle contain, black 0%, blue 25%, green 40%, red 60%, purple 80%, white 100%); /* Opera (13?) */
}
CSS3 gradient generator Explained
The CSS3 linear-gradient property is very simple and easy to use.It is a very useful tools to web designers. It allows you to create stunning interfaces using linear gradients without the need for images. You can control different linear properties of the gradient by using the generator tool above.
The first syntax defines the generator background color, which is used if the browser is old browser that doesn't support linear-gradient. The tools parameters determines the behavior of the gradient, The first one is the start position of the gradient, which can be from left to right, top to bootom. The 3rd one is the radial angle, which determine the position the gradient starts. The fourth css3 gradient generator tool is the start colour, which is also the base background color, and finally the gradient end or filter color.
Here is example syntax for css3 linear gradient, each browser has their own prefix so diferent syntax are added to support different browsers.The first syntax assign the element a background colour. This is in case the browser does not support CSS3 Gradients.
The next four lines are the variation set of rules for different browsers. CSS3 specification for linear gradient has not been fully finalised so we use these different vendor prefixes as an interim measure for old browsers. Modern browsers will support one of these rules and ignore the others.
The final line is the rule that the CSS3 specification currently defines, so we write this last in order to override the vendor prefixes when all browsers start supporting it.