FontAwesomeのWebフォントを背景として扱う

FontAwesomeのWebフォントを背景として扱う場合:afterや:beforeなどの疑似要素を使用して使用する必要があります。

.bg 
{
  position: relative;
  color: #fff;
  text-align: center;
  line-height: 100px;
  font-size: 1.8em;
  background-color: #1da1f3;
  z-index: 1;
}
.bg:before 
{
  content: '\f099';
  position: absolute;
  top: 0;
  left: 50%;
  color: #71c9f8;
  font-size: 100px;
  font-family: fontAwesome;
  z-index: -1;
}

疑似クラスbg:beforeにはtwitterのuniコードである\f099をcontent: ‘\f099’;に記載し、
font-familyにfontAwesomeを指定してあげます。

ここで、font-familyには
Font Awesomeのverが 4 から 5 になり、フォントファイルが3つに分けられることになったので、

それが、下記の3つなので、
Brands
Regular
Solid

font-family: 'Font Awesome 5 Brands';
font-family: 'Font Awesome 5 Free';/*Solid か Regular のフォントを利用する場合*/

使いたいフォントファミリーの指定方法を変える必要があります。