10 Image Shadows Using CSS

10 Image Shadows Using CSS

Today we have put together a small collection of 10 box shadows that you can use to give your images a bit more flair. The image shadows are created using the box-shadow property and with most examples we also use the :before and :after pseudo elements.
With all of the examples below, I have added a border with padding around the image to make the shadow stand out more, the CSS code used the the border is as follows:

About Rene Spronk

My name is Rene Spronk and I am the owner of CSSPortal. I started getting interested in CSS when I designed my first website, I loved how you could control so many aspects of the page with CSS. Since then I have developed many websites, but this site is still my favourite as it helps others to learn CSS.

Thanks for the write-up. It’s nice to have a simple one-stop reference for the various styles. Image Shadow 7 was interesting. I understand the implementation but the possibility wouldn’t have occurred to me.