CSS Specificity Calculator

Home/Tools/Specificity Calculator

Calculate and understand CSS selector specificity scores.

No sign-up neededRuns in your browserProduction-ready CSS

CSS Specificity Calculator

Enter CSS selectors to calculate their specificity. Specificity determines which CSS rule is applied when multiple rules target the same element.

Specificity Explanation

Format: (ID, Class, Element)

!important: Overrides specificity

Inline styles: Have higher specificity than CSS rules

Higher specificity wins when rules conflict

Results

SelectorSpecificity
div(0,0,1)

Specificity Ranks

div(0,0,1)Rank: 1
Generated CSS & HTML
div {
  /* Specificity: 0,0,1 */
  /* Higher specificity wins in case of conflicts */
}