Code Flick TechnologiesToolscodeftech.com

CSS Specificity Calculator

Paste a CSS selector and see its specificity score (a, b, c, d) — the same comparison rule the browser uses.

100% in your browser. Files never uploaded.
nav#site .menu li.active a:hover
a0b1c3d3total: 133

a = inline style · b = #id · c = .class / [attr] / :pseudo-class · d = element / ::pseudo-element. Higher tuple wins.

How to use

  1. 1
    Paste one or many selectors
    Newlines or commas separate them.
  2. 2
    Read the score
    (a, b, c, d) tuple plus a flat total for quick comparison.

Related tools