JSFiddle - React, Tailwind, and code Playground

by klierik

HTML

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.8.1/css/all.css">
<div class="icon">
  <i class="far fa-heart"></i>
</div>

CSS

body {
  padding: 5%;

  text-align: center;
}

.icon {
  font-size: 64px;
  
  display: inline-block;
  
  color: #eee;
  transition: color 500ms ease;
}

.icon:hover {
  color: #000069
}