Write a :has() selector and see exactly which elements it matches, highlighted live against real HTML — powered by your browser's own selector engine, not a simulation. Edit the markup to test your own cases.
HTML
:has() Selector
0 elements matched — highlighted below
Live Preview
Use the sample markup or paste your own — a mix of cards, images, and a form works well for exploring :has().
Try something like .card:has(img) or .card:not(:has(.badge)).
Every element the selector matches gets a green outline in the preview, in real time as you type.
Click any preset to see common :has() patterns — image presence, badge presence, and form validation state.
