FontAwesome icons not showing up in deployed website

[lancito01 (andy)]

Hey there! So I recently revamped my personal website in order to get a sleeker design that I like more, and I managed to achieve something I was proud of. I decided to use FontAwesome icons to help guide the user around the website, and they work fine in my local deployment (npm run dev) but when I push it to GitHub and the website gets deployed in Vercel, the icons don’t show up! Has anyone dealt with this issue before? Is this just a me issue? I’d appreciate any help possible. Thank you!

Current versus Expected behavior:
Current: The icons are not visible in the deployed website. The icons ARE visible when I run the website locally.
Expected: The icons are visible in both local deployment and Vercel’s deployment.

Steps to reproduce:
Download repository from GitHub - Lancito01/lancito01.dev and run “npm i” to install dependencies, then “npm run dev” to run the website. Then, go to https://lancito01.dev and you shouldn’t be able to see the icons, as they’re not visible in Vercel’s deployment.

Deployment URL or Custom Domain: https://lancito01.dev
Environment (local, preview, production): Unknown 🙁
Project Framework: React
Build Settings:
  Framework Preset: -
  Build Command (if not default): -
  Output Directory (if not default): -
  Install Command (if not default): -
Node/Runtime Version: npm ver 10.9.0
Package Manager: npm
Relevant Packages: -

[swarnava (Swarnava Sengupta)]

Hi,

It is because the access to the file is denied.

Under kit settings at Kit | Font Awesome, Make sure that:

• this is a free kit
• your domain (www.lancito01.dev & lancito01.dev) are allowed

[lancito01 (andy)]

Ah, of course. Just had to add www.lancito01.dev to the list of domains. I’m sorry, it’s all fixed now. Thank you so much!