Circular images add a polished feel to a website, and they work especially great with pictures of peoples’ faces – for instance, I can turn this:


Into this:

Here’s how to achieve this effect with CSS:

1. Crop your image to be a perfect square. The width should equal the height.

2. Add it to an image module, and assign the module the custom CSS class circular.

3. Add this CSS to your website:

/* Round images */
.circular img {
border-radius: 50%;

Note: Easiest Way to add CSS to website with Divi/Extra is:

Admin>Divi>Theme Options>Scroll to the bottom and past text there>Save