JSFiddle - React, Tailwind, and code Playground

HTML

<p class="regular">&#xf0f9;</p>
<p class="fontAwesome">&#xf0f9;</p>
<p class="custom">&#xf0f9;</p>

CSS

@font-face {
  font-family: 'FontAwesome';
  src: url('http://fortawesome.github.com/Font-Awesome/assets/font/fontawesome-webfont.eot?v=3.0.1');
  src: url('http://fortawesome.github.com/Font-Awesome/assets/font/fontawesome-webfont.eot?#iefix&v=3.0.1') format('embedded-opentype'),
    url('http://fortawesome.github.com/Font-Awesome/assets/font/fontawesome-webfont.woff?v=3.0.1') format('woff'),
    url('http://fortawesome.github.com/Font-Awesome/assets/font/fontawesome-webfont.ttf?v=3.0.1') format('truetype');
  font-weight: normal;
  font-style: normal;
}

p.regular {
    font-family:arial;
}

p.fontAwesome {
    font-family: 'FontAwesome';
}