Depending on your browser support requirements you could use clip-path
and circle
.
.clip {
display: inline-block;
clip-path: circle(100% at 50% -50%);
}
<div class="clip">
<img src="https://placehold.it/500x350" alt="">
</div>
circle(100% at 50% -50%)
defines a circle whose radius is 100%
(of container’s width) positioned at the point of coordinates x = 50%
y = -50%
on the container’s coordinate system. Adjust those parameters to fit your needs (depending on the real size of your container and image).