How to Remove Font Awesome from WordPress Theme or Plugin (2025 Guide) – Speed Up Your Site Fast!

Do you want to remove Font Awesome from WordPress theme or plugin? If you are looking for a simple yet powerful guide, keep reading this article.

In this article, I will walk you through a few simple and effective methods for completely removing or disabling Font Awesome files from your site’s frontend, helping you streamline your site for optimal performance.

🚀 Get WP Rocket Now!

Font Awesome is a free, high-quality, open-source icon library often used in many WordPress themes and plugins.

While it adds visual flair to websites, it often loads a large set of icons, even when only a few are needed.

This can lead to slower loading times and unnecessary bloat in your site’s code. Many users look to remove icon fonts WordPress themes add by default, especially if these icons are not being used.

If you’re aiming for a faster, more optimized WordPress site, removing Font Awesome or limiting its use can make a noticeable difference.

In this post, we will show you

• What Font Awesome is
• Why you should remove it
• How to properly remove it from your WordPress
• How to limit and optimize Font Awesome icons

And so on.

It is a definitive guide for anyone who needs to know more about Font Awesome and how to optimize its usage.

Before going further, let’s learn what Font Awesome is.

What Is Font Awesome

Font Awesome is a popular icon toolkit used in WordPress themes and plugins to display scalable vector icons.

It was created by Dave Gandy in 2012 and has since become one of the most popular icon libraries on the web.

It includes a wide range of icons from social media logos to interface elements that can be easily styled using CSS.

Unlike image-based icons, Font Awesome icons are rendered as fonts, allowing developers to change their size, color, or alignment without affecting quality.

These icons are often loaded through external CSS files or CDN links and are widely used in themes, page builders like Elementor, and plugins to enhance visual design.

Why You Should Remove Font Awesome from WordPress Theme or Plugin

Font Awesome may be popular, but it often loads bulky files even when only a few icons are used.

This leads to unnecessary lines of CSS and JavaScript code, increasing your page size and slowing down load times.

Many WordPress themes and plugins enqueue Font Awesome by default, whether you use it or not. If you’re not relying on these icons, keeping them adds no visual value but does impact performance.

Overloaded icon files, like unused icons or outdated Font-Awesome files, contribute to longer execution time and poor optimization by default.

Removing Font Awesome helps clean up your codebase, reduce HTTP requests, and improve your performance metrics on tools like PageSpeed Insights and GTmetrix.

It also eliminates potential styling conflicts and avoids visual issues like broken icons or ugly typography caused by missing or clashing icon elements.

For users focused on performance and clean UI, ditching unnecessary icon libraries brings both speed and a better user experience. So, disable Font Awesome if that is not working well for you.

If you’re searching for ways to disable Font Awesome WordPress site-wide, follow the step-by-step methods covered below.

Font Awesome’s Impact on Website Performance

The impact of Font Awesome on WordPress sites is mainly related to performance. When Font Awesome is loaded, it adds additional HTTP requests and increases the page size, which can slow down the page load time. This can have a negative impact on user experience and SEO.

The latest FontAwesome version 6.7.X has a wide variety of 26k+ icons across 8 styles and 68 categories, and most of the time we only use a few icons out of that for social sharing buttons, navigation buttons like menus, post meta, etc.

There are two common ways to use Font Awesome icons on your website since version 5: SVGs and Web Fonts. Only Web Fonts files can be used in previous versions, such as Font Awesome v4.

When you implement Font Awesome on a site using Web Fonts, it loads one CSS file of 93 kb (i.e., font-awesome-all.css) and one web font file of 408 kb (i.e., fontawesome-webfont.woff2). Similar to this, if you use their SVG + JS framework, it loads an additional 4-kb JS file and replaces the web font file with SVG icons.

Font Awesome Performance Test

I tested the “Get Started” page for the Font Awesome website using PageSpeed Insights and GTmetrix to determine the effect of Font Awesome on website loading speed, and the results were startling.

It took 3.1 seconds to completely load the 3.40 MB page.

According to PageSpeed Insights, removing Font Awesome’s JS and CSS files could result in a potential time savings of about 0.8 seconds. Let’s assume that the web font file took 0.2 seconds to load. By removing Font Awesome, we can reduce loading time by about 1.0 seconds.

The revelation is crystal clear – Font Awesome (files) took up a significant chunk of the website’s loading time, accounting for approximately 30% (1 second) of the total loading time that clocked in at 3.1 seconds.

The Font Awesome performance impact is most noticeable on sites where the entire icon set is loaded but only a few icons are displayed.

Please take note that the outputs of similar tests can vary depending on numerous variables, including but not limited to the testing location, internet speed, and the source of font files (whether it’s from the same server or a CDN). All of these elements have an impact on the loading time of a website, resulting in each case being unique in its own way.

I would recommend you also test your website on speed testing tools to measure the impact before drawing any inferences.

So, Font Awesome icons affect your website and increase website loading time. As per the industry standards, your website should load in less than 1.0 or 1.5 seconds. Google also prefers websites with small loading times in search results.

You can speed up WordPress by removing icons you don’t use, such as unused Font Awesome files, which reduces file requests and overall page weight.

Now, it is totally up to you whether you want a fancy website with icons and all, or you want a faster-loading website.

How to Check If Your WordPress Site is Loading Font Awesome

You can check if Font Awesome is loading by:

1. Open your website in Chrome.
2. Right-click > Inspect > Network tab.
3. Refresh the page and look for files named fontawesome.css, all.min.css, or similar.

If found, follow the removal steps below.

Alternatively, you can test your site using speed testing tools such as PageSpeed Insights or GTmetrix to see if the tools suggest any optimization for Font Awesome.

How to Remove Font Awesome from WordPress Theme and Plugin

To remove Font Awesome from a WordPress theme, there are two primary methods available:

• Manually
• Using a dedicated plugin

Below, we will show you both methods. Therefore, you can select an option based on your specific requirements and preferences.

Pro Tip: Always backup your site before making any changes, and test after each step.

Manual Method

If you want to remove Font Awesome icons from your WordPress site manually, the first step is to identify where Font Awesome is being used on your website.

It is generally integrated into the PHP or CSS files of your WordPress theme. 

Once you have identified where Font Awesome is being used, follow the instructions given below to manually remove or disable Font Awesome from WordPress.

Functions.php Method

Many popular WordPress themes like Avada include Font Awesome in the theme itself, and it loads locally from your server.

To remove Font Awesome from a WordPress Theme or plugin, you need to use the function wp_dequeue_style in the functions.php file.

First, identify the $handle of the stylesheet that you want to remove.

$handle is the unique name of your stylesheet; in this case, it was fontawesome.

I suggest you look into the functions.php file for the following Font Awesome line of code to get the handle of your stylesheet.

wp_enqueue_style( ‘fontawesome’);

Remove Font Awesome via functions.php

Add this code to your theme’s functions.php:

//* TN Dequeue Styles - Remove Font Awesome from WordPress theme
add_action( 'wp_print_styles', 'tn_dequeue_font_awesome_style' );
function tn_dequeue_font_awesome_style() {
      wp_dequeue_style( 'fontawesome' );
      wp_deregister_style( 'fontawesome' );
}

This approach lets you dequeue Font Awesome to prevent its stylesheet from loading on your site’s frontend.

To safely disable Font Awesome from a WordPress theme, we suggest you create a child theme and then add this WordPress dequeue style code to the functions.php file of your child theme rather than your main theme file.

Do not forget to back up your original functions.php file before making any changes. So that, if something goes wrong, you can revert using the backup.

Elementor Method

Add the following code to remove Font Awesome from Elementor:

//* Elementor - Disable Font Awesome by TechNumero 

add_action( 'elementor/frontend/after_register_styles', 'deregister_elementor_icons', 20 );
function deregister_elementor_icons() {
    foreach( [ 'solid', 'regular', 'brands' ] as $style ) {
        wp_deregister_style( 'elementor-icons-fa-' . $style );
    }
}

To remove Font Awesome from Elementor/Divi/Avada themes that load by default, follow the specific dequeue or plugin methods outlined here.

We would recommend using the Code Snippet plugin to safely add this code to your site. Otherwise, adding this code in functions.php directly will also work.

Style.css Method

If Font Awesome is being called from the style.css file in your theme, as shown below.

You can remove Font Awesome by deleting the line starting with @import url(………..).

@import url(/css/font-awesome.min.css);

or

@import url(https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css);

Once you delete these Font Awesome imports from CSS, Font Awesome will stop loading on your website. This method is also applicable to non-WordPress sites.

Remove Font Awesome from WordPress with Plugin

Two of the main plugins we have tested and recommend are

• Perfmatters
• Asset CleanUp

Here is how you can utilize these plugins to optimize Font Awesome.

1. Perfmatters

1. Install and activate the Perfmatters plugin.
2. Go to the Perfmatters settings page.
3. Click on the “Script Manager” tab.
4. Scroll down to find the Font Awesome script.
5. Toggle the switch next to the Font Awesome script to disable it.
6. Click the “Save Changes” button.

2. Asset CleanUp

1. First, install and activate the WP Asset CleanUp plugin.
2. Go to the plugin settings pages and select the “Frontend” tab.
3. Now, look for the “Font Awesome” option and uncheck the box to disable it.
4. Save the changes, and you are done.

Now, you can see that Perfmatters and Asset CleanUp make it easy to unload Font Awesome on specific pages or across your entire WordPress site.

And using these performance plugins to optimize Font Awesome is very straightforward and beginner-friendly.

Remove Font Awesome from any Website (Non-WordPress)

If you own a non-WordPress site, there is a high chance that Font Awesome is being directly called from the index.html file.

Open the index.html file in a text editor, and find the code that starts with

<link rel=”stylesheet” href=”…………….”>

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css" >

or

<link rel="stylesheet" href="https://yourdomain.com/assets/css/font-awesome/4.4.0/css/font-awesome.min.css">

Remove these lines as mentioned in the above code snippet from the index.html file and save the changes. And you are done, Font Awesome will not load on your site.

How to Optimize Font Awesome Usage in WordPress

Sometimes, removing Font Awesome entirely from the website may not be the ideal choice. In that case, you can optimize it to reduce the page load time and improve the user experience.

There are several strategies to optimize WordPress icons, including minimizing icon libraries and replacing them with lightweight SVGs.

Here is how you can optimize Font Awesome usage in WordPress:

• Host Locally and Minify: Download the required icon sets and load them from your server. You can then minify the CSS file to remove unnecessary code and reduce file size.
• Use SVG Instead: Consider replacing some icons with inline SVGs. These are lightweight and styleable through CSS, offering better performance and flexibility.
• Defer or Async Load the Script: Use the defer or async attribute when enqueueing Font Awesome scripts via PHP to prevent them from blocking other resources.
• Load Only the Icons You Need: Instead of loading the full Font Awesome library, use the Kit feature from Font Awesome or customize the CDN link to include only the icons you’re actually using.
• Use a CDN: If you decide to continue using Font Awesome, you can enhance performance by utilizing a CDN like BunnyCDN to host the files. A CDN (Content Delivery Network) stores files on multiple servers around the world, which reduces the distance the files need to travel and improves page load times.
• Pair with Caching Plugins: Tools like WP Rocket or W3 Total Cache can combine and minify Font Awesome files along with other static assets for improved load times.

For better performance, consider using Font Awesome alternatives like Feather Icons, inline SVGs, or native theme icons instead.

Frequently Asked Questions

Now, let’s examine some frequently asked questions about this topic.

Conclusion

Removing or optimizing Font Awesome in WordPress can significantly reduce page load times and boost site performance.

Whether you use manual methods, plugin solutions, or switch to SVG icons, these steps help streamline your site for both users and search engines.

I do not use Font Awesome or Dash icons on my websites; instead, I use SVG icons, and I would also recommend you replace font icons with SVGs.

Nowadays, popular theme developers have started using SVGs in their themes instead of Font Awesome icons.

You will find a great improvement in performance if you use themes like GeneratePress (I use it on this blog), Astra, and Kadence.

Still have questions? Leave a comment below or check out our WordPress Optimization Guide for more tips.