JSFiddle - React, Tailwind, and code Playground

HTML

<div class="book-image-wrap" style="width:250px;height:400px;">
            <div class="book-image" style="width:250px;height:400px;">
                <div class="book-image-cover" style="background:url(https://d202m5krfqbpi5.cloudfront.net/books/1347457482l/13248057.jpg);max-width:250px;max-height:400px;width:250px;"></div>
                <div class="book-image-spine" style="width:40px;height:400px;"></div>
            </div>
        </div>

CSS

.book-image-wrap {
	margin:25px auto;
	height:346px;
	width:230px;
	position:relative;
  filter:drop-shadow(-10px 10px 10px rgba(0,0,0,0.8));
	-webkit-perspective: 1200px;
	   -moz-perspective: 1200px;
	        perspective: 1200px;
}

.book-image {
	background:#000;
	height:346px;
	width:230px;
	position:absolute;
	left:16px;
	top:0;
	-webkit-transform-style: preserve-3d;
	   -moz-transform-style: preserve-3d;
	        transform-style: preserve-3d;
	-webkit-border-radius: 0 7px 7px 0;
	   -moz-border-radius: 0 7px 7px 0;
	        border-radius: 0 7px 7px 0;
	-webkit-perspective: 1200px;
	   -moz-perspective: 1200px;
	        perspective: 1200px;
	-webkit-transform: rotateY(30deg);
     -moz-transform: rotateY(30deg);
	        transform: rotateY(30deg);
}

.book-image-cover {
	position:absolute;
	left:0;
	top:0;
	height: 100%;
	width: 230px;
	max-width: 230px;
	max-height: 346px;
	-webkit-backface-visibility: hidden;
	   -moz-backface-visibility: hidden;
	        backface-visibility: hidden;
	-webkit-border-radius: 0 4px 4px 0;
	   -moz-border-radius: 0 4px 4px 0;
	        border-radius: 0 4px 4px 0;
	-webkit-transform-origin: 0;
	   -moz-transform-origin: 0;
	        transform-origin: 0;
}

.book-image-cover:after {
    background: rgba(0,0,0,0.06);
    box-shadow: 1px 0 3px rgba(255,255,255,0.1);
    content: '';
    position: absolute;
    top: 0;
    left: 10px;
    bottom: 0;
    width: 3px;

}

.book-image-spine {
	background:darkred;
	width: 40px;
	height: 344px;
	position: absolute;
	top: 0;
	left:0;
  -webkit-transform: rotateY(90deg);
	   -moz-transform: rotateY(90deg);
	        transform: rotateY(90deg);
	-webkit-transform-origin: 0;
	   -moz-transform-origin: 0;
	        transform-origin: 0;
}