<div class="box mask"></div>
<img class="mask" src="https://picsum.photos/id/1069/200/200">

.box {
  display:inline-block;
  width:300px;
  aspect-ratio:1.5;
  background: linear-gradient(45deg,blue,red);
}
.mask {
  -webkit-mask:
    radial-gradient(circle 30px at top    left ,#0000 98%,#000) top    left,
    radial-gradient(circle 30px at top    right,#0000 98%,#000) top    right,
    radial-gradient(circle 30px at bottom left ,#0000 98%,#000) bottom left,
    radial-gradient(circle 30px at bottom right,#0000 98%,#000) bottom right;
  -webkit-mask-size:51% 51%;
  -webkit-mask-repeat:no-repeat;
}


body {
  background: pink;
}