<svg>
  <mask id="mask">
  <polygon fill="black" points="150,0 174.3,74.8 253,74.8 189.4,121 213.7,195.8 150,149.6 86.4,195.8 110.7,121 47.1,74.8 125.7,74.8"/>
  </mask>
</svg>

<img src="https://source.unsplash.com/SttBW1mTo5w/900x588" alt="" />

img {
  display: block;
  width: 100%;
  max-width: 300px;
  margin: auto;
  -webkit-mask-image: url(#mask);
  mask-image: url(#mask);
}

mask {
  mask-type: alpha;
}





body {
  margin: 0;
  min-height: 100vh;
  display: flex;
  alig-items: center;
  justify-content: center;
}

svg {
  display: block;
  width: 0;
  height: 0;
}