By using site services you agree to our Cookies Use. We and our partners operate globally and use cookies, including for analytics, personalisation, and ads.Accept

/Clean CSS

An online tool to clean up your CSS files. The tool saves CSS for dynamically generated elements.

Share this tool


How much will CSS be optimized?
Here is a table with examples:
Some elements are generated dynamically, how does the system understand that styles should be left for them?
We fully execute the page in the browser so that the JavaScript code will generate dynamic elements. This way we cover more elements than when loading HTML code statically. Thus, our service also works for sites using JavaScript frameworks such as AngularJS, React, Vue.js, etc.

Of course, there is a chance of removing the needed styles. That is why we recommend cleaning only once a year and then thoroughly testing. It’s like spring cleaning in the apartment. It makes no sense to do it often, but once a year you need to do it.
How can I save necessary styles?
Some necessary styles are deleted in 2 cases: the page that uses these styles is not specified or the elements for which they are intended are dynamically generated.

If this is your first test and you have hundreds of selectors to delete, it’s easier to load the cleaned files, and then gradually return the necessary selectors as you test. This will be comparatively faster than finding places to use each individual style.

If you have only a few dozen selectors to delete, then use the page checker to find out which selectors are deleted and delete them manually if necessary. This method is often useful when you delete any module, for example, a slider on the main page.

The tool also allows you to perform useful techniques. See about them in the section below.
What useful techniques exist?

Deleting old styles:

Supposing, you deleted a slider from the home page. To remove all styles associated with this slider, you need to pass the main page through the cleaner.

Splitting a large CSS file into several styles:

Splitting a large CSS file into several styles

Supposing, you have one large CSS file. You need to divide the styles into 2 blocks.

For this, you need to do 2 checks for each set of pages. After each check, you will get a file with styles that are used in a certain set.

Segregation the pass-through styles:

Segregation the pass-through styles

Create an individual page with pass-through elements only: header, footer, H1 headers, etc. Run a check on this page.

The resulting styles are passed-through.

I have a question, suggestion or notice.
Visit our support forum. There you can find the answer to your question or ask it. We are constantly improving our services and are grateful for any of your suggestions.