CSS 3 Shadow Example


Test
Box shadow (drop shadow)
Box shadow (inner shadow)
Box shadow (outer glow)
Box shadow (inner glow)
Mixed shadow (inner, outer)



Different styles can make different effects.

You just need to experiment which one is suit the best for your design.

For positioning the shadow we can set positive or negative number (eg. 5px, -5px), just try it and see how your shadow looks like.

To create inner shadow, just add syntax inset.