Critical CSS Selector Extractor
Paste CSS and an HTML fragment to find rules that match its elements. Matching does not measure actual viewport visibility.
CSS and HTML are processed locally (100 KB each). This matches selectors only; it does not render the page or measure above-the-fold visibility.
A QUICK WALKTHROUGH
How to use this tool
- Paste CSS and the HTML fragment you want to inspect.
- Extract rules with selectors matching elements in that fragment.
- Review the output and compare it with the rendered page before using it.
Selector matching only
The browser parses stylesheet rules and tests supported selectors against the supplied HTML fragment. It cannot tell whether an element is actually visible above the fold, affected by runtime classes, or hidden by layout.
Supported syntax and limits
Simple style rules and nested @media/@supports blocks are retained when a selector matches. Imports, keyframes, font-face and unsupported at-rules are omitted. Pseudo-state selectors may not match in a static fragment. Review output manually.
Local and bounded
CSS and HTML are handled in this browser only, up to 100 KB each. Do not treat the output as a complete production critical-CSS result.
GOOD TO KNOW
Common questions
Does it find what is above the fold?
No. It matches selectors against supplied HTML but does not render layout or calculate viewport visibility.
Does it keep every CSS feature?
No. It focuses on style rules and supported media/supports blocks; inspect the result for omitted rules.