<div class="ellipse">
  <img src="https://cdn.pixabay.com/photo/2014/10/07/13/48/mt-fuji-477832_960_720.jpg" />
</div>

<div class="circle">
  <img src="https://cdn.pixabay.com/photo/2014/10/07/13/48/mt-fuji-477832_960_720.jpg" />
</div>

<div class="polygon">
  <img src="https://cdn.pixabay.com/photo/2014/10/07/13/48/mt-fuji-477832_960_720.jpg" />
</div>

.ellipse img {
  clip-path: ellipse(200px 200px at 100px 100px);
}

.circle img {
  clip-path: circle(30%);  
}

.polygon img {
  clip-path: polygon(5% 5%, 100% 10%, 900% 75%, 75% 75%, 75% 100%, 60% 75%, 20% 80%);
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.