Downloaded the latest version of the Font Awesome Icons as a .zip file, I extract the files and uploaded the file all.css as a static resource in my scratch org.

  1. Below is my html
<i class="fab fa-facebook-square"></i>
//For the above tag only square shows up but not the icon 
<li><a class="fab fa-facebook-square" href="https://www.facebook.com/michiganalumni"></a></li>
<li><a class="fab fa-twitter" href="https://twitter.com/michiganalumni"></a></li>
<li><a class="fab fa-instagram" href="https://www.instagram.com/michiganalumni"></a></li>
<li><a class="fab fa-linkedin-in" href="https://www.linkedin.com/groups/3435"></a></li>
<li><a class="fab fa-youtube" href="https://www.youtube.com/c/AlumniAssociationUM"></a></li>
  1. Here is my JS File
import FontsforSocialMedia from '@salesforce/resourceUrl/FontAwesome';
import { loadStyle } from 'lightning/platformResourceLoader';

renderedCallback() {
            loadStyle(this, FontsforSocialMedia + '/all.css')
        ]).catch(error => {


Can anyone help me with this, please?


Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.