JSFiddle - React, Tailwind, and code Playground

by allcaps

HTML

<link rel="stylesheet" href="//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css">
<p class="wrapper"><input placeholder="&#61447; Username"/></p>

CSS

.wrapper input[type="text"] {
    position: relative; 
}

input { font-family: 'FontAwesome'; } /* This is for the placeholder */

.wrapper:before {
    font-family: 'FontAwesome';
    color:red;
    position: relative;
    left: -10px;
    content: "\f007";
}