<div class="container">
  <h1 class="fadeIn">Fade In</h1>
</div
body{
  display:flex;
  justify-content: center;
  background-color:#eee;
  font-family: 'peacock';
  align-items:center;
  flex-direction: column;
}

h1{
  font-size:30vh;
}
.container{
  border:1px solid #bbb;
  padding:1rem 3rem;
}
.fadeIn {
	opacity: 0;
 transform: translate3d(0, 20px, 0);

	cursor: pointer;
	transition: 0.25s all ease-in-out;
}

.fadeIn:hover {
	opacity: 1;
  transform: translate3d(0, 0, 0);
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.