JSFiddle - React, Tailwind, and code Playground
HTML
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
<i class="ico-large fa fa-stack-overflow"></i>
<i class="ico-large fa fa-spinner fa-spin"></i>
<i class="ico-large fa fa-circle-o-notch fa-spin"></i>
<i class="ico-large fa fa-refresh fa-spin"></i>
<i class="ico-large fa fa-cog fa-spin"></i><br>
<i class="ico-large fa fa-spinner fa-pulse"></i>
CSS
.ico-large {
font-size: 60px;
}
.fa-stack-overflow {
color: transparent;
text-fill-color: transparent;
-webkit-text-fill-color: transparent;
background: -webkit-gradient(linear, 0 0, 0 100%, from(#F47920), to(#818185));
background: -webkit-linear-gradient(#F47920, #818185);
background: -moz-linear-gradient(#F47920, #818185);
background: -o-linear-gradient(#F47920, #818185);
background: linear-gradient(#F47920, #818185);
-webkit-background-clip: text;
background-clip: text
}