AZ Tools

CSS Selector Tester

Developer

Paste some HTML and a CSS selector to instantly see every element the selector matches, with the count and each matched element's markup. Uses the browser's own selector engine, so the results are identical to document.querySelectorAll — great for debugging scrapers, stylesheets and test selectors. Invalid selectors are flagged. Everything runs locally in your browser — nothing is uploaded.

How to use

  1. Paste your HTML into the first box.
  2. Type a CSS selector (for example li.item or a[href^="https"]).
  3. See the match count and each matching element; copy them if needed.

Frequently asked questions

Which selectors are supported?
Any selector your browser supports via querySelectorAll, including combinators, attribute selectors, :not(), :nth-child() and more. Pseudo-elements like ::before match nothing, as in the DOM.
Are the results accurate?
Yes. The HTML is parsed into a real document and queried with the browser's native selector engine, so matches are exactly what querySelectorAll would return on that markup.
What if my selector is invalid?
The selector field is highlighted and an error message is shown, instead of returning misleading results.
Is my HTML sent anywhere?
No. Parsing and matching happen entirely in your browser; nothing is uploaded.

Related tools