JSFiddle - React, Tailwind, and code Playground

HTML

<div>ELENA LELENA</div>
<div class="a">ELENA LELENA</div>
<div class="b">ELENA LELENA</div>
<div class="c">ELENA LELENA</div>

<div class="d">ELENA LELENA</div>
<div class="e">ELENA LELENA</div>

CSS

@font-face {
  font-family: 'Titillium Web';
  font-style: normal;
  font-weight: 400;
  src: local('Titillium Web'), local('TitilliumWeb-Regular'), url(http://themes.googleusercontent.com/static/fonts/titilliumweb/v1/7XUFZ5tgS-tD6QamInJTcdGU7DQ8I6RFMlK0vgclk7w.woff) format('woff');
}
@font-face {
  font-family: 'Titillium Web2';
  font-style: normal;
  font-weight: 400;
  src: local('Titillium Web'), local('TitilliumWeb-Regular'), url(http://themes.googleusercontent.com/static/fonts/titilliumweb/v1/7XUFZ5tgS-tD6QamInJTcdGU7DQ8I6RFMlK0vgclk7w.woff) format('woff');
}
@font-face {
  font-family: 'Titillium Web2';
  font-style: normal;
  font-weight: 700;
  src: local('Titillium WebBold'), local('TitilliumWeb-Bold'), url(http://themes.googleusercontent.com/static/fonts/titilliumweb/v1/anMUvcNT0H1YN4FII8wpr0bathaSTBR2c4i13_wzlb0.woff) format('woff');
}

@font-face {
  font-family: 'Titillium Web Bold';
  font-style: normal;
  font-weight: 700;
  src: local('Titillium WebBold'), local('TitilliumWeb-Bold'), url(http://themes.googleusercontent.com/static/fonts/titilliumweb/v1/anMUvcNT0H1YN4FII8wpr0bathaSTBR2c4i13_wzlb0.woff) format('woff');
}
div {
    font-family: 'Titillium Web';
    font-weight: 400;
}
.a {
    font-family: 'Titillium Web';
    font-weight: bold;    
}
.b {
    font-family: 'Titillium Web Bold';
    font-weight: 700;    
}
.c {
    font-family: 'Titillium Web Bold';
    font-weight: 400;    
}
.d {
    font-family: 'Titillium Web2';
    font-weight: normal;
}
.e {
    font-family: 'Titillium Web2';
    font-weight: bold;    
}