JSFiddle - React, Tailwind, and code Playground

HTML

<div class="cube"></div>

CSS

.cube {
	position: absolute;
	top: 50px;
	left: 50px;
	width: 20px;
	height: 20px;
	background: red;
	
	/*transition: .3s opacity;*/
  opacity: 0.5;
  z-index: 999999;
}

.cube::before {
	position: absolute;
	top: -10px; left: -10px;
	right: -10px; bottom: -10px;
	content: '';
	background: black;
	z-index: -1;
}