JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://netdna.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css">
<p>external ressources - http://netdna.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css</p>
<i class="fa fa-5x fa-spinner fa-spin"></i>
<p>is it better?</p>
<i class="fa fa-5x fa-spinner fa-spin-new"></i>

CSS

body{
    font-family:sans-serif;
}

.fa-spin-new {
  -webkit-animation: spin 0.8s steps(8) infinite;
  -moz-animation:  spin 0.8s steps(8) infinite;
  -o-animation:  spin 0.8s steps(8) infinite;
  animation:  spin 0.8s steps(8) infinite;
}