November 7, 2012 - No Comments!

How to Create a Nice Inner Box-Shadow Effect with CSS

This is a designer staple - an inner shadow, so simple to do in Photoshop, used to be not so simple to do in CSS.  But with the magic of CSS3 it's all gravy.  Copy paste this standard gem of a snippet, or create a sass mixin and attach it to your selector (as any sane person would do).

Example

Content Here

The Code

box-shadow: 1px 2px 30px 10px rgba(0,0,0,0.1) inset ;

How does it work?

box-shadow: h-shadow v-shadow blur spread color inset;

src: W3 Schools

Published by: admin in Snippets

Leave a Reply