Create Account
Sign In

CSS3 Shadows Generator (Box-Shadow)

Welcome on the CSS3 Shadows Generator (Box-Shadow),
This generator let you generate a CSS3 code that adds a shadow to an html box. This generator let you easily configure different parameters of the shadow. You can change the size (spread), the color, the opacity, the blurriness, the type of shadow (inner or outter) and the offset of the shadow. While you change the parameters of the shadow a preview automatically updates to the new configuration. When the result satisfies you, you can directly copy the CSS3 code of the shadow in the Code section of this generator. The CSS3 properties generated with this generator works only on the newest browsers like FireFox, Safari, Google Chrome, Internet Explorer 9, Opera...


This is the CSS3 code to use to add the shadow on an HTML element:



Outter Inner

Browsers specific prefixes

Related Tools (that might interest you)

CSS3 Text Shadows Generator (Text-Shadow) CSS3 Border-Radius Generator CSS3 Button Generator Rounded Corners Generator (compatible with IE) HTML5 <Video> Tag Generator Users Configuration Viewer