JSFiddle - React, Tailwind, and code Playground

HTML

<div class="wrapper">
  <input type="text">
  <span class="placeholder">Placeholder</span>
</div>

CSS

.wrapper{
  position: relative;
}

input {
  font-size: 14px;
  height: 40px;
}

.placeholder {
  position: absolute;
  font-size:25px;
  pointer-events: none;
  left: 1px;
  top: 1px;
  transition: 0.1s ease all;
}

input:focus ~ .placeholder{
  top: 1px;
  font-size: 11px;
}