JSFiddle - React, Tailwind, and code Playground

HTML

<div class="outer">
  <div class="inner">

  </div>
</div>

CSS

.outer,
.inner {
  clip-path: polygon(20% 0%, 100% 0, 100% 20%, 100% 80%, 80% 100%, 0 100%, 0% 80%, 0% 20%);
}

.outer {
  width: 400px;
  height: 350px;
  background: red;
  position: relative;
}

.inner {
  width: 350px;
  height: 300px;
  left: 25px;
  top: 25px;
  position: absolute;
  background: url("https://cdn.24.co.za/files/Cms/General/d/6724/edbc74ded5bb474a9b7c58e727f7ec07.png");
  background-size: cover;
  background-position: center;
}