<div class="box">
  <svg width="100%" height="100%" viewBox="0 0 254 187" fill="none" xmlns="http://www.w3.org/2000/svg">
    <path d="M40.522 29.5885C46.809 12.1352 63.3672 0.5 81.9183 0.5H235C245.493 0.5 254 9.00659 254 19.5V167.5C254 177.993 245.493 186.5 235 186.5H39.5016C12.4869 186.5 -6.34571 159.699 2.80952 134.283L40.522 29.5885Z" fill="#C4C4C4" />
  </svg>

  <div class="box-content">
    <h1>Search Data</h1>
    <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Exercitationem nostrum provident accusantium sit eligendi, ducimus eius dolor asperiores. Necessitatibus rerum molestiae cumque ipsam a voluptatem at! Tenetur ad harum temporibus.</p>
    <a href="">lorem more</a>
  </div>
</div>
.box {
  width: 400px;
  height: 318px;
  position:relative;
  padding-left:20px;
}
.box svg {
  z-index: -1;
  position: absolute;
}
.box-content {
  padding: 20px 0px 20px 140px;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.