JSFiddle - React, Tailwind, and code Playground

HTML

<div class="big"></div>
<div class="back-to-top"></div>

CSS

.back-to-top{
  opacity:0;
  transition: opacity 1s; 
  background-color:red;
  width:30px;
  height:30px;
  position:fixed;
  right:10px;
  bottom:10px;
}
.big{
  height:2000px;
}
.fade-in{
  opacity:1;
  transition: opacity 1s; 
}

JavaScript

var scrollUp = document.getElementsByClassName('back-to-top')[0];

window.onscroll = function(){
    if(window.pageYOffset >= 400){
        scrollUp.classList.add("fade-in");
    }else{
        scrollUp.classList.remove("fade-in");
    }
}

scrollUp.onclick = function(){
    window.scrollTo(0,0);
}