<div class="container">
  <div class="left__side">
    <h1 class="title">Lorem ipsum dolor sit.</h1>
    <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Vero, nisi.</p>
    <p>Labore aliquam temporibus placeat unde, alias pariatur voluptate! Numquam, quidem.</p>
    <p>Aliquid deleniti a possimus exercitationem iusto. Exercitationem sapiente debitis perferendis.</p>
  </div>
  <div class="right__side">
    <div class="img__inner"></div>
  </div>
</div>
body {
  margin: 0;
  padding: 0;
  font-family: sans-serif;
  line-height: 1.3;
}

h1 {
  font-size: 30px;
  margin-bottom: 10px;
}

.container {
  display: flex;
  min-height:100vh;
  background-color: #000;
}

.left__side, .right__side {
  width: 50%;
}

.left__side {
  padding: 20px;
  color: #fff;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.right__side {
  filter: drop-shadow(-20px 0px 0px lightgreen);
}

.img__inner {
  width: 100%;
  height: 100%;
  background-image: url('https://picsum.photos/900/600');
  background-size: cover;
  clip-path: polygon(25% 0%, 100% 0%, 100% 100%, 25% 100%, 5% 50%);
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.