Índice da vitrine
Ações
Formulários
Retorno
Conteúdo
Botões e rótulos
A matriz de dez intenções por variante, nas quatro famílias: botão, chip, badge e pill.
Botões
Os dois eixos do sistema: a intenção dá a cor por tokens locais e a variante só os consome. Uma linha por variante, com as dez intenções.
.es-btn--filled
.es-btn--gradient
.es-btn--outline
.es-btn--glass
.es-btn--ghost
.es-btn--sm, padrão, .es-btn--lg
:disabled
Chips
O rótulo interativo, para filtro e remoção: hover e foco existem porque o clique é real.
.es-chip--filled
.es-chip--soft
.es-chip--outline
Badges
O rótulo estático de contagem ou estado: sem hover e sem foco, porque não é interativo.
.es-badge--soft
primarysecondarysuccessdangerwarninginfocautionsteel-bluenavy-bluedark
.es-badge--filled
primarysecondarysuccessdangerwarninginfocautionsteel-bluenavy-bluedark
Pills
O rótulo estático arredondado, o meio-termo entre badge e chip.
.es-pill--soft
primarysecondarysuccessdangerwarninginfocautionsteel-bluenavy-bluedark
.es-pill--outline
primarysecondarysuccessdangerwarninginfocautionsteel-bluenavy-bluedark