CSS Specificity Calculator

Paste one or more CSS selectors to see the (a, b, c) specificity breakdown and compare which selector wins. Supports pseudo-classes, pseudo-elements, attributes, and :not()/:is()/:where().

CSS selector(s) — comma-separate to compare

#main-nav.item:hover

ID1

CLS2

EL0

SCORE(1,2,0)

ID (#)Class / Attribute [attr]Pseudo-class (:)ElementPseudo-element (::)Universal (*)

This tool runs entirely in your browser. No data is sent anywhere.