Font Awesome Icons Not Loading

HTML-CSS
1

I am really stuck, I’ve tried troubleshooting why FontAwesome won’t load but I have no idea. I’m using a personal kit which is set to V6 of FontAwesome.

<link rel="stylesheet" href="https://kit.fontawesome.com/48bcbf2c30.css" crossorigin="anonymous">

Which is by the way nested in my <head> element.

I only want to use brand icons all of which should be free to my understanding, for example I put this within my body element with no luck:

<i class="fa-brands fa-square-facebook"></i>

2

I’m getting CORS blocked (on Codepen) when using the CSS file they link to. Try using the JS file instead.

<script src="https://kit.fontawesome.com/48bcbf2c30.js" crossorigin="anonymous"></script>

Or just use a CDN link for the CSS file instead.

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.3.0/css/all.min.css">