JSFiddle - React, Tailwind, and code Playground

by Ian Sadovy

HTML

<i class="icon"></i>

CSS

body {
  font-family: monospace;
}

/*  i:before {
  content: 'before--';
 }
 
 i:after {
  content: 'after';
 } */

/* i:before,
i:after {
  content: '';
  display: inline-block;
  width: 100px;
  height: 100px;
  background: red;
}

i:after { 
  background: blue;
} */

@font-face {
  font-family: "flexmonster-icons";
  src: url("https://cdn.flexmonster.com/theme/assets/flexmonster-icons.woff");
  font-weight: normal;
  font-style: normal;
}

i:before {
  content: '\e90c';
  font-family: "flexmonster-icons";
  font-size: 200px;
  font-style: normal;
  color: red;
}