Skip to main content

Calculadora de Especificidade CSS

Calcule e compare pontuações de especificidade de seletores CSS. Entenda a prioridade de estilos para melhorar sua arquitetura CSS.

🎯

Adicione seletores para comparar suas especificidades

Como Ler a Especificidade

Inline
Estilização direta via atributo style
IDs
Direcionamento com #id
Classes / Atributos / Pseudo-classes
Direcionamento com .class, [attr], :hover, etc.
Elementos / Pseudo-elementos
Direcionamento com div, p, ::before, etc.
Compartilhar ferramenta
📖

Como usar

Step 1

Inserir Seletores

Inserir Seletores

Insira os seletores CSS

Step 2

Calcular

Calcular

A especificidade é calculada automaticamente

Step 3

Ver Resultados

Ver Resultados

Verifique os valores de especificidade e comparação

Recursos

Cálculo Instantâneo

Calcule a especificidade instantaneamente enquanto digita os seletores

Comparação de Seletores

Compare a especificidade de múltiplos seletores lado a lado

Exibição Visual

Exiba a especificidade como (a, b, c) e gráfico de barras

FAQ

Um sistema que determina a prioridade dos seletores: ID > classe > seletores de elemento.