<div class="box"></div>

.box {
  width:300px;
  aspect-ratio:1.5;
  background:
    radial-gradient(circle 30px at top    left ,#0000 98%,red  ) top    left,
    radial-gradient(circle 30px at top    right,#0000 98%,blue ) top    right,
    radial-gradient(circle 30px at bottom left ,#0000 98%,green) bottom left,
    radial-gradient(circle 30px at bottom right,#0000 98%,purple) bottom right;
  background-size:51% 51%;
  background-repeat:no-repeat;
}


body {
  background: pink;
}