Free CSS Specificity Calculator
Score a selector and see what wins.
Runs locallyNo uploadPrivate
Loading tool…
About the CSS Specificity Calculator
Free CSS specificity calculator. Paste a selector to score it as (IDs, classes, elements), see each part weighted, and understand exactly why one rule beats another. Runs in your browser.
How it works
- 1
Paste a selector
Any CSS selector.
- 2
See the score
(IDs, classes, elements) with parts.
- 3
Know what wins
Understand the cascade at a glance.
Frequently asked questions
As three numbers — IDs, then classes/attributes/pseudo-classes, then elements. They're compared left to right; more IDs always wins.
!important overrides normal specificity. Inline styles beat selectors, but an !important declaration beats inline styles too.