Awesome font icon 5 does not appear when called by css

Question

Personal am using fontawesome 5 and some icons do not appear when I call them by css follows my code and screen print of how the icone is being displayed.

HTML:

<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.0.10/css/all.css" integrity="sha384-+d0P83n9kaQMCwj8F4RJB66tzIwOKmrdb46+porD/OvrJ+37WqIM7UoBtwHO6Nlg" crossorigin="anonymous">

<div class="col-lg-2 offset-lg-2 align-self-center">
    <p class="phone">Ligue para nós<br><span>11 97032-5884</span></p>
</div>

SCSS:

.phone{
    position: relative;
    color: $white;
    font-family: 'Montserrat', sans-serif;
    font-size: 14px;
    line-height: 17px;
    &:after{
      content: '\f232';
      font-family: "Font Awesome 5 Free";
      font-weight: normal;
      font-style: normal;
      position: absolute;
      left: -35px;
      top: 50%;
      font-size: 25px;
      margin-top: -7.5px;
      color: $white;
    }
    span{
      font-weight: 700;
      font-size: 20px;
    }
  }

Answer 1

Your font-family is wrong! Vcused to Font Awesome 5 Free but it should be the Font Awesome 5 Brands

body {
  background-color: black;
  color: #fff;
}
.phone {
  position: relative;
  color: white;
  font-family: 'Montserrat', sans-serif;
  font-size: 14px;
  line-height: 17px;
  margin-left: 50px;
}

.phone:after {
  content: "\f232";
  font-family: "Font Awesome 5 Brands";
  font-weight: normal;
  font-style: normal;
  position: absolute;
  left: -35px;
  top: 50%;
  font-size: 25px;
  margin-top: -7.5px;
  color: white;
}

.phone span {
  font-weight: 700;
  font-size: 20px;
}

<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.0.10/css/all.css">

<div class="col-lg-2 offset-lg-2 align-self-center">
  <p class="phone">Ligue para nós<br><span>11 97032-5884</span></p>
</div>

Note that in the documentation itself indicates the use of Brands Style