Migrate to Netlify Today

Netlify announces the next evolution of Gatsby Cloud. Learn more

ContactSign Up
Community Plugin
View plugin on GitHub


Disables Font Awesome auto CSS insertion and instead inserts it at compile time.


Go to this Gatsby example site with Font Awesome icons. On the initial load, the page will jump. This is more clear if you disable JavaScript and reload the page. The problem is that Font Awesome inserts its styles in the frontend.


First, follow Font Awesome docs to add it to your app.

Second, install the plugin:

yarn add gatsby-plugin-fontawesome-css


npm install --save gatsby-plugin-fontawesome-css

How to use

// In your gatsby-config.js
module.exports = {
  plugins: [`gatsby-plugin-fontawesome-css`],
© 2023 Gatsby, Inc.