JSFiddle - React, Tailwind, and code Playground

by petroveg

HTML

<div class="block"></div>

CSS

html {
	background: #f0f0f0;
}
.block {
	position: relative;
	width: 300px;
	height: 300px;
	margin: 50px 0 0 50px;
	background: #fff;
}
.block:before {
	content: "";
	position: absolute;
	z-index: -1;
	top: 100%;
	right: 0;
	left: 10%;
	height: 50px;
	background: linear-gradient(rgba(0, 0, 0, .1), transparent);
	transform-origin: 100% 0;
	transform: rotate(8deg) skewX(-30deg);
}