See exact CSS specificity in Chrome Dev Tools?

Chrome dev tools sorts classes by their specificity from top-to-bottom.

Check this out:

enter image description here

Inspect an element (in this case an svg) and type in the css attribute you want to see the specificity for (this case "height').

Highest is always on top!

The chrome extension "CSS Dig" offers a solution to the finding the values of specificity in chrome in 0,0,0 format

The extension works and does the job but has a few bugs

Link : https://chrome.google.com/webstore/detail/css-dig/lpnhmlhomomelfkcjnkcacofhmggjmco?utm_source=chrome-ntp-icon

Related