CSS specificity calculator

Score CSS selectors as the (a,b,c) specificity tuple — compare which rule wins before you debug the cascade.

Selectors stay in this browser — nothing is sent anywhere.

Counts IDs → classes/attributes/pseudo-classes → types/pseudo-elements. :is()/:not()/:has() contribute their strongest argument, :where() contributes 0, and the universal selector counts for nothing. Legacy single-colon pseudo-elements (:before) count as pseudo-elements. This is a scoring reference — it does not apply styles.

How to use

  1. Paste selectors (comma-separated or one per line).
  2. Read each selector's a,b,c score, sorted strongest first.
  3. Higher tuple wins; source order breaks ties.

What it supports

Counts IDs → classes/attributes/pseudo-classes → types/pseudo-elements. :is()/:not()/:has() take their strongest argument, :where() counts 0, universal counts 0. Inline styles and !important sit above selectors and aren't scored. Up to 50 selectors.

Related tools

Related guides