Índice da vitrine
Início
Ações
Formulários
Navegação
Autenticação
Retorno
Conteúdo
Botões
A matriz de dez intenções por variante, os três tamanhos, o botão com ícone e o botão que é um link.
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
Botão com ícone
O ícone entra no mesmo slot do texto e o espaçamento vem da classe. Não existe prop `icon`: ela só aceitaria os ícones que o componente conhece, e cada site derivado traz os seus.
<echo-button><icon-add /> …</echo-button>
aria-label
Botão que é link
Quando a ação NAVEGA, o elemento é uma âncora e não um botão: só a âncora abre em nova aba, aparece no menu do botão direito e é lida como destino. A aparência é a mesma classe.
.es-btn em <a> / <nuxt-link>
Para agentes de IA
Especificação desta página
Um arquivo Markdown com as tags, props, eventos e trechos desta família, copiáveis ipsis litteris, mais as regras que valem antes de qualquer linha. Entregue-o ao agente junto com a tarefa.
/agents/buttons.md