← All tools

CSS Selector Specificity Calculator

Parse CSS selector lists and compare A/B/C specificity tuples, including :is(), :not(), :has(), :where() and nth-child of selectors.

css-specificity-calculatorLOCAL WORKSPACE

Enabling local controls…

Each input: 1 MiB UTF-8; output: 2 MiB. Loading stops after 15 seconds; processing after 2 seconds. Content stays local, without uploads or storage.

Compare A, then B, then C; this is not the full cascade. Resolve nesting (&) first. Shadow DOM :host(), :host-context() and ::slotted() are unsupported.

Enter input or load a sample, then run.

If clipboard access is denied, select the read-only output manually. Input HTML, SVG, CSS and JavaScript are never rendered or executed.

How to use this tool

Enter selector lists on separate lines, calculate and compare the ranked tuples. A wins before B, then C; values are not decimal scores.

When not to use it

Specificity alone does not decide the CSS cascade. Resolve nesting (&) first. Shadow DOM :host(), :host-context() and ::slotted() are unsupported. Inline style, layers, origin, importance and source order are outside this tuple.

Read the guide →