Critical CSS Extraction

Instant first paint,

zero effort.

pageflare extracts the CSS your page actually needs to render above the fold, inlines it, and defers everything else. No render-blocking stylesheets, no manual work.

~60%
Less render-blocking CSS
Instant
First paint
Zero config
Fully automatic
Capabilities

Surgical precision,
zero configuration.

DOM-Aware Extraction

Parses your actual HTML to determine which CSS selectors match above-the-fold elements. Not a guess — a real analysis.

Automatic Inlining

Critical styles are inlined directly into the HTML <head> as a <style> tag. No extra requests, no render-blocking.

Smart Deferral

Non-critical CSS loads asynchronously in the background. Your visitors see content immediately while the rest loads seamlessly.

Advanced Minification

All CSS is minified automatically — dead code removal, shorthand collapsing, and smaller payloads across the board.

Full CSS Support

Media queries, @font-face, keyframe animations — all at-rules are analyzed and correctly classified as critical or deferred.

Zero Configuration

No viewport dimensions to set, no manual selector lists. Point pageflare at your site and critical CSS just works.

How it works

Parse. Extract.
Inline.

1

Parse the DOM

pageflare parses your HTML into a real DOM tree and loads each linked stylesheet. Every CSS selector is tested against the actual page structure.

2

Split critical vs deferred

Selectors that match above-the-fold elements become critical CSS. Everything else — unused selectors, below-fold styles — is deferred.

3

Inline and defer

Critical CSS is minified and inlined into a <style> tag. The original stylesheet is switched to async loading with a noscript fallback.

Get started

Faster first paint. One command.

Install the CLI, point it at your build output, and see results in under two seconds.