How to Create Rounded-Circular Image Using CSS | Using Border-Radius To Create Rounded Image

Hellow Coders

To create a perfect circular image we can use the border-radius property. if an image is square, i mean height & width is the same we can add style as “border-radius:50%”, which will create a perfect rounded image. if an image is not square you can change border-radius accordingly to achieve a perfect rounded image. If you don’t want to adjust border-radius, you can make the image square using the height & width property of CSS.

Check Below Example For Creating Rounded Image

Rounded Image Using CSS Border Radius 50%

In the above example, you can see a perfect circular image. If your image is not square please use the height or width property of CSS to make it square.

If you use internal or external CSS instead of inline styling you can use code as below

image { border -radius: 50%;}

    Leave a Reply

    Your email address will not be published.