/* Define the Font */
@font-face {
  font-family: 'asblog-Regular';
  src: url('asblog-regular.eot');
  src: url('asblog-regular.eot?#iefix') format('embedded-opentype'),
      url('asblog-regular.woff') format('woff'),
      url('asblog-regular.ttf') format('truetype'),
      url('asblog-regular.svg#asblog-regular') format('svg');
  font-weight: normal;
  font-style: normal;
}


/* This is the div that we will use the icons within */
.preview {
  font-family:'asblog-Regular';
  text-align: center;
  font-size: 65pt;
  line-height: 45pt;
  -webkit-transform: translate3d(0, 0, 0);  /* So webkit renders clean*/
  -webkit-font-smoothing: antialiased;  /* So webkit renders clean*/
}

/* Use as normal text, the icons will render in place of the characters */
<div class="preview">T D R F G</div>