The page is slow, and PageSpeed Insights silently points to dashicons.min.css, 30 KB of icons that aren't rendered in any visible element. You didn't install this file or enqueue it in your theme, yet it faithfully loads for every visitor. Where does it come from, and how do you get rid of it?

WordPress ships dashicons to the frontend by default for a single narrow purpose: the admin bar for logged-in users. A regular guest never sees the admin bar, but the browser dutifully downloads the CSS, parses it, builds the CSSOM, and only then realizes that not a single class was needed. On a slow mobile connection, those 30 KB translate into an extra 300-400 ms of render-blocking load time, enough to hurt your Core Web Vitals.

Below are three ways to disable dashicons: from a manual snippet to a single checkbox in an optimization plugin. All methods are safe, reversible, and tested on real WordPress installations.

💡 Quick overview:

• Open DevTools or PageSpeed Insights and confirm that dashicons.min.css is actually loading on your site
• Choose the approach that fits your workflow: code in functions.php or a ready-made optimization plugin
• Re-test performance and verify the file is gone from the report
• Make sure the admin bar still works without errors for administrators

What are dashicons and why do they load on the frontend

Dashicons are WordPress's built-in icon font, introduced in version 3.8. Inside the admin panel they appear everywhere: menu section icons, post type icons, toolbar buttons. Without dashicons the admin area turns into bare text, and WordPress cannot drop them.

The problem lies in the registration mechanism. The core registers the dashicons styles globally and adds them to the queue not only for the admin but also for the frontend, all for a single scenario: a logged-in user visits the site and sees the black admin-bar strip with icons. Guests don't get the admin bar, yet they do get the CSS file. The browser parses it, discovers that no selector matched, and throws the result away, but the time is already spent.

PageSpeed Insights and GTmetrix flag dashicons.min.css in the "Remove unused CSS" recommendation and dock points. One file like this seems minor. But when emoji styles from WordPress, CSS from unused plugins, and dead theme blocks pile on top of it, the combined savings reach 150-300 KB. For mobile performance that matters.

How to check whether dashicons load on your site

Before disabling anything, confirm the problem exists. Three methods, each under a minute.

Chrome DevTools. Open the site in incognito mode (so the admin bar doesn't affect the test), press F12, go to the Network tab, and type dashicons in the filter field. If you see a file with status 200 and a size around 30 KB, it loads for every visitor.

PageSpeed Insights. Paste the URL into pagespeed.web.dev and run the test. Expand the "Remove unused CSS" recommendation; dashicons.min.css will be listed with its size and potential savings in kilobytes.

GTmetrix. Go to the Waterfall tab and filter by dashicons. Even if the file in the loading chain is marked "Low" or "Lowest," it still blocks rendering and drags down your score.

None of these methods showed the file? Your theme or an optimization plugin has already disabled dashicons, and you can close this article. Did you find it? Let's move on.

Method 1: disable via code in functions.php

The lightest and most transparent approach: a single snippet in the functions.php of your active theme. The code deregisters dashicons for all visitors without administrator privileges. For those who administer the site we leave them alone, and the admin bar inside the dashboard stays intact.

Add this code to the functions.php of a child theme or via the Code Snippets plugin (safer because it survives theme changes):

1
/**
2
 * Disable dashicons.min.css on the frontend for everyone,
3
 * except users with administrator rights.
4
 */
5
function sdstudio_disable_dashicons_frontend() {
6
    if ( current_user_can( 'update_core' ) ) {
7
        return;
8
    }
9
    wp_deregister_style( 'dashicons' );
10
}
11
add_action( 'wp_enqueue_scripts', 'sdstudio_disable_dashicons_frontend' );

The wp_enqueue_scripts hook fires when the styles queue is assembled on the frontend. current_user_can('update_core') checks for the capability to update core, which by default belongs only to administrators. For regular visitors the check fails, and wp_deregister_style('dashicons') removes the file from the queue entirely.

Why deregister instead of dequeue? wp_dequeue_style removes the style from the queue but leaves it registered; another plugin could add dashicons back to the output. wp_deregister_style strips the registration completely, and the only way to bring the file back is an explicit wp_register_style call. For dashicons this is the right choice: you don't want a social-sharing or gallery plugin to accidentally restore them on the frontend.

Precautions. An error in functions.php can white-screen the site. Before editing, copy the file to functions.php.bak for a quick rollback. Use a child theme or Code Snippets. Double-check syntax: every bracket and semicolon in place.

Method 2: optimization plugins (one checkbox instead of code)

If you prefer not to touch PHP, performance plugins solve the same problem.

Perfmatters. Under General → Options you'll find a "Disable Dashicons" toggle. One click and the file disappears from the frontend. Perfmatters also excludes dashicons from Used CSS when Remove Unused CSS is active, so the issue is covered twice. The plugin is paid, but it addresses dozens of other performance bottlenecks, from disabling emoji styles to controlling the heartbeat API.

WP Rocket. Under File Optimization → Optimize CSS Delivery, enable "Remove Unused CSS." WP Rocket will analyze your pages and strip unused styles, including dashicons.min.css. It works automatically across the entire site. If Remove Unused CSS conflicts with another optimization, add dashicons.min.css to the exclusion list; WP Rocket will defer its loading instead of removing it entirely.

Asset CleanUp (free). The Asset CleanUp plugin lets you selectively disable CSS and JS at the level of individual pages and content types. Go to CSS/JS Manager, find dashicons.min.css, and unload it site-wide. The free version handles basic cleanup.

Which method should you choose? If you already use Perfmatters or WP Rocket, use the built-in feature; don't pile extra code in functions.php. If your site runs on a minimal set of plugins and you're comfortable with PHP, the snippet from method 1 is lighter and adds no dependencies.

Verify the result

After disabling dashicons, open the site in incognito mode and repeat the check from section two. The file dashicons.min.css should be gone from the list of loaded resources in DevTools. Run a fresh PageSpeed Insights test; the "Remove unused CSS" metric will drop, and the potential traffic savings will increase by those 30 KB.

The real gain in points depends on your stack. On lightweight sites with just one or two CSS issues, disabling dashicons adds 1-3 points to the mobile PageSpeed score. On bloated sites with dozens of unused styles it's a drop in the bucket, but a correct drop: every kilobyte counts, and such "drops" add up to a noticeable result.

Be sure to check the admin bar: log in as an administrator and confirm that the black strip at the top displays normally and its icons are in place. The code from method 1 and the toggle in Perfmatters leave dashicons untouched for administrators, so you won't notice any difference.

⁉️🤔 Frequently asked questions

Will disabling dashicons affect the site's appearance?

If your theme uses dashicons for frontend icons (slider arrows, close buttons, hamburger menu), disabling them will break those elements. Testing is simple: disable the file and walk through the pages. If icons vanish, the theme relies on dashicons. In that case use aggressive caching through Cloudflare or a caching plugin: 30 KB served from browser cache is not critical.

Does this method work with block themes (FSE)?

In block themes such as Twenty Twenty-Four, Ollie, and similar, dashicons usually do not load on the frontend. The block editor uses its own SVG icons, and core doesn't enqueue the icon font for visitors. Check via DevTools: chances are the file isn't there. If you do find it, the code from method 1 works the same way for classic and block themes.

Can I disable dashicons only for certain pages?

Yes, using WordPress conditional tags. For example, to keep dashicons only on the homepage:

1
function sdstudio_conditional_dashicons() {
2
    if ( is_front_page() ) {
3
        return;
4
    }
5
    if ( current_user_can( 'update_core' ) ) {
6
        return;
7
    }
8
    wp_deregister_style( 'dashicons' );
9
}
10
add_action( 'wp_enqueue_scripts', 'sdstudio_conditional_dashicons' );

All available conditional tags are described in the WordPress documentation. They include is_single for individual posts, is_page for pages, is_archive for archives, and is_home for the blog index.

I already have a caching plugin speeding up the site. Should I still disable dashicons?

A caching plugin speeds up repeat visits, but the first cold visit still pulls dashicons.min.css. PageSpeed Insights emulates a clean cache on every test, so the file will appear in the report regardless of server-side caching. Disabling dashicons reduces data transferred at the source level; both metrics and real visitors on their first visit benefit.

Is disabling dashicons enough for a good PageSpeed score?

No, it's just one step among dozens. The biggest wins usually come from image optimization (compression, modern formats, lazy loading), deferred JavaScript loading, and server-side caching. Think of disabling dashicons as basic hygiene: quick, safe, with a measurable effect. It's a convenient starting point for cleaning up the frontend.

Which method to choose for your situation

A quick summary of the three methods and specific scenarios.

If you work with code and your site runs on a lean stack, grab the snippet from method 1. Two minutes to paste it into functions.php or Code Snippets, and the issue is closed for good. No extra plugins, no additional load on the admin.

If you already pay for Perfmatters or WP Rocket, enable the built-in option and don't create extra entities. These plugins solve another dozen performance problems at once, and additional code in the theme only complicates maintenance.

If you need a free tool without editing PHP, Asset CleanUp handles the task in two clicks. It suits beginners and those who prefer not to risk breaking functions.php.

The general principle: dashicons don't make a site slow by themselves. But they are part of the background noise that, combined with unused plugin styles, heavy fonts, and unoptimized images, clogs the channel and slows rendering. Removing dashicons is a quick win and a convenient starting point for systematic optimization.

Disabled them? Drop a comment and share how many PageSpeed points you gained. If you know another method not covered in this article, share that too.