Style.Tools is a free CSS optimization browser-widget that provides access to an advanced critical CSS generator.
Style.Tools is available with 1 click on any page on the internet, including pages behind a login.
Start Style.Tools🔬 FEO (drag the link to the favorites bar to install the widget)
The critical CSS generator is based on PostCSS and can provide 100% accuracy for complex designs. The generator provides Puppeteer-like browser control that enables discovery of CSS that may be applicable by browser activity such as scripts, events and scrolling.
The advanced critical CSS generator can extract critical CSS in a few seconds on any page on the internet. The following animated gif shows a demo.
Navigate to the page for which you want to extract critical CSS and start the Style.Tools browser widget. Click here for installation instructions.
The critical CSS generator can be accessed via the Tools tab in the header. The generator can be configured using JSON. Click here for documentation.
The output of the critical CSS generator is raw and requires further optimization such as compression. The Style.Tools widget provides access to advanced CSS code optimization tools that can be applied with 1 click.