Find Unused CSS

Find unused css

I've been looking for a while, and the best thing I found was this:

http://unused-css.com/

They scan your site and email you the result css.

I am aware you are working on a localsite, however if you find no alternative, you can upload your site somewhere and use this

Alternatively

You could install a previous version of firefox that is compatible with dust-me selectors and run it along side your current installation of firefox.

Angular 8/Sass: Find unused css classes

There are a lot of IDE plugins for that.

On my case I use https://marketplace.visualstudio.com/items?itemName=rcore.rcore-unused-css-classes from Visual Studio Code Extensions

How to find unused classes in my HTML?

This may be helpful: https://code.google.com/p/find-unused-classes/ . According to the description:

It shows classes that exist in css selectors and do not exist on html page and like-verse.

As Jim said, be warned that some classes may be unused by your stylesheets but still used in JavaScript.

Detect unused CSS rules

You can get a general idea with chrome's developer tools.

Open the page in Chrome
Open developer tools (Ctrl+Shift+I)
Open the Audits tab
click run
expand the "Remove unused CSS rules" item to view a list of style sheets that contain unused style rules.

~~This doesn't list them out~~ oh wait... it does... XD

How can I detect unused CSS on my website, across all pages?

Sorry for the late answer, I've found your question when searching for the same thing. Anyway you might be interested by :

https://purifycss.online/.

It removes unused css and you can add multiple urls.

Good luck

PS: I'm editing my answer because I found another website doing the unused CSS removal, maybe it will help someone reading this.

Removing unused CSS from website code

You can get pretty close to what you are asking for with the Google Chrome's Audit tab under Developer Tools. It does not remove unused CSS, but it will show you what CSS rules are not being used.

Observe:
Sample Image