You're working on a website where you want a circular profile picture, but the original image is square. How would you achieve this effect using CSS?

  • border-radius: 50%;
  • clip-path: circle(50%);
  • mask-image: url(circle-mask.png);
  • transform: rotate(45deg);
To create a circular profile picture from a square image, you can use the border-radius property and set it to 50%. This will round the corners of the square image and make it appear as a circle.
Add your answer
Loading...

Leave a comment

Your email address will not be published. Required fields are marked *