How to create rounded profile pictures with CSS

Here's an easy way to display a rounded or oval profile picture from a square or rectangular image without editing it.

To make a rounded or oval profile picture from an existing square or rectangular image you just need to tell the browser to display it as such by using the CSS "border-radius" property with a value of 50%, as follows:




This example will display a square image as a circle