Calcule e compare a especificidade de seletores CSS instantaneamente
Seletores CSS (um por linha)
Inclua ou omita as chaves { } — apenas o seletor importa.
Como funciona
- 🔴 a — Seletores de ID (#id): peso máximo
- 🟡 b — Classes (.class), atributos ([type]) e pseudo-classes (:hover)
- 🔵 c — Elementos (div, p) e pseudo-elementos (::before)
- ⚪ Seletor universal (*) e combinadores não têm peso
- :where() tem especificidade zero; :is() e :not() herdam a do argumento mais específico
- Estilos inline têm a > qualquer seletor; !important anula tudo