Core Code
Core Code Modern Dev Handbook

Circular Image Shape

Use border-radius to create circular images.

Preview

Code

<style>
img{
width:140px;
height:140px;
border-radius:50%;
object-fit:cover;
}
</style>

<img src="https://via.placeholder.com/140">

More CSS Image Shapes Examples (8)

example Rounded Image Shape open example example Clip Path Circle open example example Clip Path Polygon open example example Triangle Image Shape open example example Ellipse Image Shape open example example Text Wrap Around Shape open example example Text Wrap Polygon Shape open example example Shape Change on Hover open example