See also:
CSS cursors

-webkit-box-shadow -moz-box-shadow box-shadow: { 

inset? && [ <offset-x> <offset-y> <blur-radius>? <spread-radius>? && <color>? ]

}

CSS 3 box-shadow property, inset keyword and spread radius test case

As of now there is no longer a need to use -webkit- or -moz- prefixes. Unprefixed box-shadow is widely supported. If you want to support some older smartphones with default browsers based on WebKit you might consider to keep the -webkit-prefix for now.

This site's script no longer adds those prefixes. So you will not see shadows with browsers older than  Firefox 4, Safari 5.1 or Chrome 10.

Currently (2012-07) only Gecko (Firefox), Safari, and Opera have a CSS standard compliant implementation in regard to blur radius.
Other browsers (IE 9, Google Chrome) differ in blurring and might follow sooner or later.
Note that the two WebKit browsers Safari and Chrome behave different.
So you should use Firefox, Safari 5.1, or Opera 12 as reference to create a future-proof blurred box-shadow.

Read What does a blur radius mean? from Mozilla's David Baron if you are interested in tech details. You can check a browser's blur implementation for correctness with David's box-shadow blurring algorithm test.

Stehkoſthalle
Frankenſtein
border-radius: 50%; box-shadow: inset 0.3em 0.3em 0.9em black;
0.5em -0.5em 0.4em red, 0.5em 0.5em 0.4em gold, -0.5em 0.5em 0.4em lime, -0.5em -0.5em 0.4em blue;

If the shadow color is omitted (as in the four examples below),
box-shadows are drawn in foreground color (text color).
Older WebKit browsers are buggy and ignore those shadows.
This bug is fixed in WebKit 536.7 and therefore fixed since Chrome 20 and Safari 6.

0 0 0 0.5em;
0 0 1em;
1em 0.5em;
1em 0.5em 1em;
0.3em 0.3em silver;
0.3em 0.3em 0 0.6em silver;
0 1.5em 0 -0.7em silver;
2em 1.5em 0 -0.7em silver;
0 0 1em maroon;
0 0 1em 0.5em maroon;
0 0 1em 1em maroon;
-0.4em -0.4em 1em olive;
0.4em 0.4em 1em olive;
0.4em 0.4em 1em -0.2em olive;
0.4em 0.4em 1em 0.4em olive;
0 1.5em 0.5em -1em olive;
inset 0.2em 0.4em red, inset -1em -0.7em red;
inset 11em 0 red;
inset -1em 0 red;
inset 13em 0 3em -3em orange, inset -3em 0 3em -3em blue;
inset 11em 0 2em orange;
inset 0 0.3em red;
inset 0 -1.1em red;
inset 1em 0 1em -1em blue;
inset 0 0 0.5em blue;
inset 0 0 2em blue;
inset 0 2em 3em -1em green;
inset 0 2em 3em -2em green;
inset 0 2em 3em -3em green;
inset 0 0 1em khaki;
inset 0 0 1em khaki, inset 0 0 1em khaki, inset 0 0 1em khaki, inset 0 0 1em khaki;
inset 0 0 0.5em 0.5em khaki; /* similar to above */
/* seamless if <blur-radius> ≤ <spread-radius> */
inset 0 0 0.5em 0.5em khaki; /* background: black */
inset 0 0 2em 2em khaki; /* background: red; padding: 2em */
0 0 0.5em 0.5em teal; /* background: teal */
inset 0 0 0.5em 0.5em indigo, 0 0 0.5em 0.5em indigo; /* padding: 1em */
inset 0 0 1em black, inset 0 0 1em black, inset 0 0 1em black, inset 0 0 1em black;
inset 0 0 0.7em 0.5em black; /* should be very similar to above in CSS conforming browsers like Firefox */
inset 0 2em 3em -1.5em green, inset 0 -2em 3em -2em blue;
inset 1em 1em 2em -1em blue;
inset 1em 1em 2em -1em blue, inset -1em -1em 2em -1em red;
inset 0 2em 3em -2em white, inset 0 -2em 3em -2.5em black; /* background:red */
inset 1em 1em 1em -1em white, inset -1em -1em 1em -1em black; /* background:red */
inset -1em -1em 1em -1em black, inset 1em 1em 1em -1em white; /* background:red */
inset -0.3em -0.3em 0.6em rgba(0,0,0,0.5), inset 0.3em 0.3em 0.6em rgba(256,256,256,0.7);
inset 0.3em 0.3em 0.6em rgba(256,256,256,0.5), inset -0.3em -0.3em 0.6em rgba(0,0,0,0.5);
0.2em 0.2em 0.7em black, inset 0 0 0.7em red;
Mit freundlicher Unterstützung von Elektronotdienst Nürnberg
Besuchen Sie auch 100 Mbit Netzwerk über Telefonkabel