akarshsatija/purifycss

PurifyCSS helps you shrink your website's CSS files by removing styles you're not actually using. If you've ever included a CSS framework like Bootstrap, you know that you typically use only a fraction of what it offers, the rest just adds unnecessary weight to your site. This tool looks at your HTML and JavaScript, figures out which CSS classes are actually being referenced, and throws away everything else. The tool works by scanning your project files for class names. It reads through your HTML, JavaScript, PHP, or templates, collects every CSS selector it finds, and then filters your CSS files to keep only the matching rules. It's smart enough to catch classes that are constructed dynamically in JavaScript, for example, if you join string fragments together or use a library like React's classNames to conditionally apply styles. You can use it as a standalone command-line tool, a JavaScript function in your build scripts, or through plugins for popular build tools like Grunt, Gulp, and webpack. This is useful for developers and teams building websites who want faster load times without manually auditing their stylesheets. A concrete example from the README: a Bootstrap CSS file starts around 140KB. Even after standard minification it's still 117KB. But if you run it through this tool first, then minify, you can get it down to roughly 35KB, because you're only keeping the 40% of styles your app actually references. A couple of things worth noting: the tool doesn't modify your original CSS files, so it's safe to experiment with. You write the trimmed output to a new file. You can also whitelist specific selectors if you want to guarantee they survive the cut, useful for classes added dynamically by third-party code that the scanner might miss. The command-line version has one limitation: it doesn't support file pattern matching (like *.js), so you need to list files explicitly when using it that way.