CSS specificity calculator

Compare selectors as three-part scores.

On your device · No account
Privacy details

CSS specificity calculator processes your input in this browser. Inputs and results are excluded from analytics. Recent tools save tool names, visit counts and last-visit times. Saved tools store only their names. Draft saving is optional and stays on this device; delete saved text with the draft controls. Loading text from a URL is optional and contacts that server; its URL and your IP address are visible to the server. An optional “Use in” action keeps a handoff in this tab. The next tool removes it on arrival and ignores it if more than a minute has passed.

Copy link includes the inputs you choose to share in the address. Anyone with that link can reopen them. Files and generated results are excluded. Password and key tools share settings only.

Options and local file

Optional settings apply only to this tab.

Your result

Reset reloads the tool with its starting values and releases open files and device controls. Saved drafts stay on this device until you delete them.

Links include your inputs and settings. Anyone with the link can see them, so leave out private text. Files and generated results are left out; random draws run again.

Keyboard shortcuts

Updated

CSS specificity calculator explained

Calculate selector specificity with separate ID, class and type columns. The argument of :where() contributes zero; :is(), :not() and :has() use the largest argument score. The of-selector in :nth-child() contributes in addition to the pseudo-class.

Next: CSS formatter

Next: CSS clamp calculator

Next: CSS layout generator

A worked example

#a .b p has specificity [1, 1, 1]. :where(#a) p has [0, 0, 1], even though its argument contains an ID.

Before you use the result

This compares selector syntax, not the winning declaration on a live page. Nested & selectors need their parent context. Unknown functional selector rules are rejected rather than assigned a guessed score.

Cite this page

ToolOctopus. “CSS specificity calculator.” Updated 2026-09-20. https://tooloctopus.com/css-specificity.

Add an access date if your instructions require one.

Citation formatting uses citeproc-js by Frank Bennett and Citation Style Language styles. Licence and source code.

Find a tool

Search by task. Use ↓ and ↑ to choose, Enter to open.