JSFiddle - React, Tailwind, and code Playground

by khamer

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/velocity/1.2.3/velocity.js  Copy"></script>
<div class="circles">
<div class="circle"></div>
<div class="circle two"></div>
</div>

CSS

.circle {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 100px;
  height: 100px;
  background: peru;
}

.circles {
   -webkit-perspective: 100px;
   perspective: 100px;
}

.two {
  left: 25%;
  background: salmon;
  transform: translateZ(-100px);
}