Marketing Button
Botão customizável orientado à conversão, usado para promover ações estratégicas de marketing com liberdade visual fora dos padrões do Design System.
Uso
Use o Marketing Button quando for necessário destacar ações com foco em performance de marketing, como assinaturas ou campanhas promocionais. Ele é ideal para contextos que exigem experimentação visual e flexibilidade, permitindo ajustes baseados em testes A/B e métricas de conversão. Por não seguir os padrões rígidos do Design System, ele deve ser usado de forma estratégica, evitando a quebra da consistência visual em outras partes da interface.
Anatomia
❖. Container
Agrupa todos os elementos internos do botão.
Responsável por aplicar interações visuais como hover e pressed.
Elemento essencial para atrair atenção com efeitos visuais customizados.
Pode receber estilos distintos, definidos por testes ou estratégias visuais específicas.
1. Icon Left
Slot opcional para ícone, geralmente representando uma ação associada à assinatura.
Deve se manter visualmente equilibrado com o label, respeitando o espaço interno do botão.
Em alguns contextos pode ser omitido para focar apenas na mensagem textual.
2. Label
Texto principal do botão.
Deve ser curto e objetivo, com mensagens voltadas à conversão (ex: "Assine", "Conheça").
A label pode variar conforme o teste de marketing, por isso não é fixada a um único texto.
Variantes
Letras Primary
Variante utilizada no tema padrão do header, com fundo neutro.
Ideal para ambientes mais clean, mantendo contraste visual com o background claro.
Indicada para situações em que o botão precisa se destacar sem conflitar com outros elementos visuais do topo.
White Solid
Variante usada no tema clássico do header, com fundo na cor principal do produto.
Possui alta visibilidade e contraste, sendo eficaz para contextos onde o botão precisa ter maior destaque visual.
Recomendada para aplicações em headers com background escuro ou colorido.
Histórico de Atualizações
Atualizado