JSFiddle - React, Tailwind, and code Playground

HTML

<script src="&lt;link href=&quot;//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css&quot; rel=&quot;stylesheet&quot;&gt;"></script>
<div class=""header>
    <i></i>
    <h1>some text goes here</h1>
</div>

CSS

@font-face{
    font-family:FontAwesome;
    src:url(https://netdna.bootstrapcdn.com/font-awesome/2.0/font//fontawesome-webfont.eot?#iefix) format('eot'),
	url(https://netdna.bootstrapcdn.com/font-awesome/2.0/font//fontawesome-webfont.woff) format('woff'),
	url(https://netdna.bootstrapcdn.com/font-awesome/2.0/font//fontawesome-webfont.ttf) format('truetype'),
	url(https://netdna.bootstrapcdn.com/font-awesome/2.0/font//fontawesome-webfont.svg#FontAwesome) format('svg');
    font-weight:400;font-style:normal;}

.header {
    position: relative;
}
h1 {
    margin: -130px 0 0 200px;
}
i {
    color: red;
    display: inline-block;
    width: 0px;
    height: 0px;
    border-style: solid;
    border-width: 200px 0 0 200px;
    border-color: transparent transparent transparent black;
}
i:before {
    font-family: 'FontAwesome';
    content: "\F005";
    font-size: 64px;
    position: absolute;
    top: 100px;
    left: 40px;
}