Tailwind CSS class .z-10 / .z-*

<div class="relative">
    <div class="z-auto absolute t-0 l-0 ml-10 mt-10 bg-teal-800 h-8 w-8"></div>
    <div class="z-40 absolute t-0 l-0 ml-0 mt-0 bg-teal-300 h-8 w-8"></div>
    <div class="z-30 absolute t-0 l-0 ml-2 mt-2 bg-teal-400 h-8 w-8"></div>
    <div class="z-20 absolute t-0 l-0 ml-4 mt-4 bg-teal-500 h-8 w-8"></div>
    <div class="z-10 absolute t-0 l-0 ml-6 mt-6 bg-teal-600 h-8 w-8"></div>
    <div class="z-0 absolute t-0 l-0 ml-8 mt-8 bg-teal-700 h-8 w-8"></div>
</div>

.z-0 { z-index: 0; }
.z-10 { z-index: 10; }
.z-20 { z-index: 20; }
.z-30 { z-index: 30; }
.z-40 { z-index: 40; }
.z-50 { z-index: 50; }
.z-auto { z-index: auto; }