← All text tools

CSS specificity calculator

Work out which CSS selector wins, with each selector's (IDs, classes, elements) score.

  • Free
  • No sign-up
  • Works on any device

About CSS specificity calculator

Paste CSS selectors and see each one's specificity as three numbers: IDs, then classes, attributes and pseudo-classes, then elements. The higher score wins regardless of source order, and equal scores go to the later rule. Inline styles beat all selectors, and !important beats those.

How to use CSS specificity calculator

  1. Set the options above. The result updates live.
  2. Change anything until it's just right.
  3. Copy the result or download it.

Why use this tool?

Also known as

Frequently asked questions

What is the specificity of a class selector?

A single class counts as 0,1,0. An ID is 1,0,0 and a plain element such as div is 0,0,1. Compare them left to right, not as one decimal number.

Is CSS specificity calculator free?

Yes. CSS specificity calculator on Toolipedia is free to use, with no sign-up and no watermark.

Is it safe to use?

Yes. Everything is worked out in your browser, and nothing you enter is sent to our server.

Does it work on my phone?

Yes. It works in any modern browser on Android and iPhone, as well as on tablets and computers. There's nothing to install.

Do I need an account?

No. Just open the page and use the tool. There's no sign-up and no email needed.

Related tools