JSFiddle - React, Tailwind, and code Playground

by Freer Hall

HTML

<div>
  <div class='modal-desc-wrap'>
    <div>
      Haha
    </div>
  </div>
</div>

CSS

/* Move the image to show it */
.modal-desc-wrap{
    font-size: 120%;
    font-weight: 900;
    grid-area: modal-desc-wrap;
    text-align: center;
    margin-top: 60px;
}

.modal-desc-wrap div{
    perspective: 250px;
    display: inline-block;
    color: black;   
    position: relative;
}
.modal-desc-wrap div::before, .modal-desc-wrap div::after{
    content: '';
    z-index: -1;
    top: -0.5em;
    left: -1.5em;
    bottom: -0.6em;
    position: absolute;
    right: -2em;
    background-color: white;
    transform: rotateX(360deg) rotateY(15deg) rotate(1.5deg) skewX(25deg);
    padding: 2em 3em .1em .5em;
}

.modal-desc-wrap div::before{
    background-color: black;
    top: -0.9em;
    bottom: -1em;
    left: -1.7em;
    right: -2.4em;

}