Your files stay on your device

CSS specificity calculator

Score CSS selectors as IDs, classes, and types, compare two head to head, and rank the heaviest rules in a pasted stylesheet.

Enter a selector or load an example.

Specificity is only one step of the cascade: origin and !important come first, then layers, then these (a, b, c) triples, and source order breaks every tie. This tool does not read your elements or compute which rule actually wins on a live page; it scores the selector text alone. Functional pseudo-classes are forgiving lists here, so an argument that does not parse is skipped rather than failing the selector, which matches how browsers treat :is(), :where(), :not() and :has().
Options

More regex & cron tools

- Regex tester (/dev/regex-tester)
- Glob tester (/dev/glob-tester)
- Accessible name debugger (/dev/accessible-name-debugger)
All regex & cron tools (/dev)

Was this tool useful?
YesNo

Canonical HTML: https://nutter.tools/dev/css-specificity-calculator
Markdown version: https://nutter.tools/dev/css-specificity-calculator.md
Plain-text version: https://nutter.tools/dev/css-specificity-calculator.txt
Agent index: https://nutter.tools/llms.txt