CSS How to Add Shadow to Image?

Spread the love

In this article, we will learn How to add shadow to an image with the help of CSS.

Adding a shadow to an image lightens the image and brings it a new look & feel. If you are willing to add an image we can use the CSS for the same.

How to add shadow to image with CSS?

There is a property in CSS known as box-shadow property which is responsible for giving a shadow effect to any image.

With the help of the following CSS, we can give a shadow to the image.

Let’s jump into the practical code to add the shadow to an image:-

    img {
       box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3);
    }

    <img src="https://lifeincoding.com/wp-content/uploads/2024/03/smile.png" />

How to add shadow to image with CSS

Spread the love