Purge CSS / CSS Cleaner

Purge CSS tool helps you remove unused CSS rules from your stylesheets to reduce file size and improve website performance. This free online tool is ideal for developers who want to optimize CSS by keeping only the styles actually used in their HTML. Paste your CSS and HTML, and the tool will generate a cleaned, optimized CSS output.

Paste your HTML here
Purged CSS

1 How it works

  1. Input your HTML: Paste the HTML structure of your page.
  2. Input your CSS: Paste your full stylesheet.
  3. Purge: The tool analyzes your HTML and removes any CSS selectors that don't match elements in the DOM.

2 Example

HTML Input

1
2
3
4
5
6 
<div class="container">
  <div class="card">
    <h1 class="title">Hello World</h1>
    <p class="text">This is a sample.</p>
  </div>
</div>

CSS Input

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19 
.container {
  max-width: 1200px;
  margin: 0 auto;
}
.card {
  background: white;
  padding: 2rem;
}
.title {
  font-size: 2rem;
  color: #333;
}
.unused-class {
  color: red;
  display: none;
}
#unused-id {
  background: blue;
}

Purged CSS Output

1
2
3
4
5
6
7
8
9
10
11 
.container {
  max-width: 1200px;
  margin: 0 auto;
}
.card {
  background: white;
  padding: 2rem;
}
.title {
  font-size: 2rem;
  color: #333;
}

3 Benefits

Smaller Files

Significantly reduce CSS file size by removing dead code.

Faster Load Times

Smaller files mean faster downloads and rendering for your users.

Related Tools

Need to format CSS? Use our CSS Formatter.

Need to compile SCSS? Use our SCSS Compiler.

Need to format HTML? Use our HTML Formatter.

Copied to clipboard!