JSFiddle - React, Tailwind, and code Playground

by khamer

HTML

<div class="cool" style='--text: "UPSIDE DOWN"'>
</div>

CSS

.cool::before,
.cool::after {
    font-family: fantasy;
    font-size: 20vmin;
    content: var(--text);
}

.cool::before {
  position: absolute;
  transform: rotateX(180deg) translateY(6vmin);
  filter: blur(2vmin);
  opacity: .75;
  transform-origin: bottom;
}