Using Node.js

If you're using Node.js, the @fortawesome/fontawesome-svg-core NPM package exports methods that can be used to perform various tasks.


Start by installing the Font Awesome SVG Core package:

npm install @fortawesome/fontawesome-svg-core

Then you can tap into the API from within your app or project:
import { library, icon } from '@fortawesome/fontawesome-svg-core'
import { faCamera } from '@fortawesome/free-solid-svg-icons'

library.add(faCamera)

const camera = icon({ prefix: 'fas', iconName: 'camera' })


Accessing the configuration


When using the @fortawesome/fontawesome-svg-core package:


import { config } from '@fortawesome/fontawesome-svg-core'
console.log(config.autoA11y) // true

When using a package that provides access to the API through the browser:

<script>alert(window.FontAwesome.config)</script>

Using a <script> tag in the browser:
<html>
  <head>
    <script src="https://your-site-or-cdn.com/fontawesome/v6.0.0/js/all.js" data-auto-a11y="true" ></script>
  </head>
  <body></body>
</html>

Referencing Icons

We recommend referencing icons in your HTML with a dedicated element you'll use only for icons. We find the <i> tag perfect for the job. That element will contain: 1) Font Awesome specific style prefix (e.g. fa-solid), and 2) the icon's name (prefixed with fa-) you want to display.


<i class="fa-solid fa-question-circle"></i> <!-- solid style of the question circle icon -->
<i class="fa-regular fa-question-circle"></i> <!-- regular style of the question circle icon -->
<i class="fa-light fa-question-circle"></i> <!-- light style of the question circle icon -->

<i class="fa-brands fa-facebook"></i>        <!-- facebook brand icon-->
<i class="fa-brands fa-facebook-f"></i>      <!-- facebook "f" brand icon-->