how to use i tag for custom icons, how to make custom icon

.main {
  display: inline-block;
  border: 2px solid grey;
  padding: 1rem;
  border-radius: 50%;
  .sub-main {
  i{
    background: url('./../assets/socialicon/facebook (1).svg');
    height: 1.2rem;
    width: 1.2rem;
    display: block;
    background-size: contain;
  }
  }
}


<div class="main">
  <div class="sub-main">
    <i>

    </i>

  </div>
</div>