<svg class="svg">
  <clipPath id="my-clip-path" clipPathUnits="objectBoundingBox"><path d="M0,0 c0.007,0.297,0.014,0.465,0.021,0.502 c0.007,0.041,0.013,0.227,0.112,0.227 c0.099,0,0.142,-0.056,0.12,-0.219 s-0.03,-0.232,0.071,-0.232 c0.101,0,0.062,0.195,0.052,0.234 c-0.027,0.113,-0.052,0.339,0.059,0.358 c0.112,0.019,0.127,-0.102,0.13,-0.189 c0.003,-0.084,-0.032,-0.36,0.062,-0.36 c0.098,0,0.122,0.14,0.089,0.254 c-0.071,0.241,-0.033,0.424,0.109,0.424 c0.1,0,0.153,-0.161,0.159,-0.484 L1,0 H0"></path></clipPath>
</svg>

<div class="clipped"></div>

body {
  height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
}

.svg {
  position: absolute;
  width: 0;
  height: 0;
}
.clipped {
  width: 350px;
  height: 350px;
  background: turquoise url(https://source.unsplash.com/900x900?summer);
  background-size: cover;
  -webkit-clip-path: url(#my-clip-path);
  clip-path: url(#my-clip-path);
}