Add a drop shadow to your PNG image using CSS

Add a drop shadow to your PNG image using CSS is possible. Live fiddle.

https://jsfiddle.net/shakalya/nwfy7yfc/

.shadowed {
-webkit-filter: drop-shadow(12px 12px 25px rgba(0,0,0,0.5));
filter: drop-shadow(12px 12px 25px rgba(0,0,0,0.5));
-ms-filter: “progid:DXImageTransform.Microsoft.Dropshadow(OffX=12, OffY=12, Color=’#444′)”;
filter: “progid:DXImageTransform.Microsoft.Dropshadow(OffX=12, OffY=12, Color=’#444′)”;
}

Use the above class to add  drop shadow to your PNG image in CSS.

Leave a Comment