NEW - Check out our NEW program SheCodes Bootcamp - and become a developer in just 4 months!
More
Learn more
Discover how to troubleshoot a Font awesome icon not appearing due to possible reasons such as no loading of the CSS or incorrect icon name
Why is Font Awesome icon not showing up?
It could be due to a few reasons:
html Copy code
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous">
Check if the specific icon exists in the Font Awesome version that you are using. For example, this icon was first has been added in Font Awesome 5.11.2.
Make sure the link is pointing to the correct icon name. Here is the list of icons on Font Awesome. For example, the HTML code for theater-masks should be <i class="fas fa-theater-masks"></i>.
icons from font awesome are not showing when copy and pasting html embed link from font awesome website. Please help
This could be caused by a missing <link> tag in the <head> of your HTML document. To solve it, make sure you have added the code snippet the Font Awesome website gives you when you select the icon or use the following code snippet and adjust it according to the icon you chose:
html Copy code
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.13.1/css/all.min.css">
For an in-depth guide on how to use Font Awesome, please see the guide here: https://fontawesome.com/how-to-use/on-the-web/setup/getting-started
