CSS Specificity Calculator
Calculate selector specificity.
Keep or share the finished result
Copy or share after running the tool. Saved tools and settings stay in this browser.
What would you like to do next?
Calculate CSS specificity
When a CSS rule does not apply as expected, selector specificity is often part of the reason. Paste a selector to estimate its specificity score, including ID selectors, classes, attributes, pseudo-classes and element selectors. It is useful for debugging cascade conflicts and refactoring overly strong selectors.
Understand cascade weight
The calculator is a practical helper for one selector at a time. Complex selector lists should be checked separately.
Frequently asked questions
What does specificity look like?
Specificity is shown as ID count, class-like count and element count.
Does it handle :where()?
The tool treats :where() as zero because CSS gives it zero specificity.
Can specificity replace cascade debugging?
No. Source order, layers, importance and inheritance can also affect the final style.