CSS Selector Tester
Test CSS selectors against HTML and see matched elements with counts, tags, and snippets. Supports :nth-child, attribute selectors, combinators, and pseudo-classes.
About this tool
A CSS selector targets elements in an HTML (or XML) document. Selectors power document.querySelectorAll(), element.querySelector(), CSS rules, browser DevTools, scraping libraries like Cheerio, and testing tools like Playwright and Cypress. This tool lets you write a selector, paste HTML, and instantly see which elements match — so you can verify a selector before shipping it to CSS or JavaScript.
Supports the full range of selector syntax: type (div), class (.card), id (#main), attribute ([href^="https"]), pseudo-classes (:nth-child(odd), :not(.muted), :is(h1, h2), :first-child), and combinators (> child, + adjacent sibling, ~ general sibling, (space) descendant).
Examples:
li:nth-child(odd)against a<ul>with five<li>items matches items 1, 3, and 5.a[href^="https"]matches every link whosehrefstarts withhttps, useful for finding insecure (http) links by negation.div.card > h2matches only<h2>elements that are direct children of<div class="card">.
FAQ
Why does my selector return zero matches? ›
The most common cause is a typo in a class or id. Other frequent causes: using a pseudo-element (::before, ::after) which selects generated content not real elements, or expecting :nth-child to count only a specific tag when it actually counts all siblings regardless of tag (use :nth-of-type for tag-scoped counting).
What's the difference between > and a space? ›
A space is the descendant combinator — it matches at any depth. div p matches a <p> anywhere inside a <div>, even nested deeply. The > is the child combinator — it matches only direct children. div > p matches a <p> that is an immediate child of <div>, not grandchildren.
Does this support :nth-child(an+b) formulas? ›
Yes. The full an+b syntax works: nth-child(2n) for every even element, nth-child(3n+1) for every third starting at the first, nth-child(-n+3) for the first three, and the keywords odd and even.
Can I test selectors that the browser doesn't support? ›
This tool uses your browser's native querySelectorAll, so it matches whatever your current browser supports. Very new or experimental selectors may not work in older browsers even if they work here.