Uma boa call to action é um rótulo de botão curto, que começa com um verbo e diz o que o visitante recebe, mais uma linha de microcopy que elimina a principal preocupação dele. Aqui estão 60 exemplos originais agrupados por tipo de página (hero, preços, formulário, e-mail e mais), cada um com um design de botão e o motivo de funcionar.
Uma call to action (CTA) é o elemento que pede ao visitante que faça a próxima coisa: um botão, um link ou às vezes um formulário. A maioria das CTAs que funcionam tem três características em comum:
Todos os exemplos abaixo foram escritos para esta página; nenhum foi copiado de uma empresa real. Troque pela sua própria oferta e só mantenha uma promessa (um prazo, um tempo de resposta, um plano grátis) se ela for verdadeira para você.
Busque por palavra ("grátis", "teste", "agendar") ou por tipo de página ("preços", "e-mail").
Ir para: Seção hero · Página de preços · Formulário · E-mail · Página de produto · Blog e newsletter · Onboarding de app
O primeiro botão que o visitante vê. Ele deve indicar o primeiro passo, não a jornada inteira.
Sem cartão. Cancele em dois cliques.
Por que funciona: Junta a ação às duas preocupações que as pessoas têm antes de um teste: pagamento e como sair.
Um técnico da sua região retorna a ligação em até um dia útil.
Por que funciona: Diz o que o "grátis" oferece e quando algo vai acontecer.
Conecte uma planilha e tenha um dashboard em minutos.
Por que funciona: Promete um resultado pessoal em vez de uma demo genérica.
Três perguntas. Preço na tela, sem ligação de vendas.
Por que funciona: Primeira pessoa ("meu") mais uma ideia clara do esforço.
Responda cinco perguntas e receba um cardápio para imprimir.
Por que funciona: Indica um resultado concreto que o visitante consegue imaginar.
Busque por CEP, dia ou nível.
Por que funciona: Corresponde à pergunta real do visitante (onde e quando) em vez de "Saiba mais".
Abre no seu navegador. Nada para instalar.
Por que funciona: Verbo de baixo compromisso mais a remoção da barreira da instalação.
Agenda ao vivo para os próximos 60 dias.
Por que funciona: Em reservas, a disponibilidade é a primeira pergunta, então comece por ela.
Escolha seus equipamentos e quanto tempo você tem.
Por que funciona: O visitante cria algo; a microcopy mostra que o resultado se adapta a ele.
Um PDF de 12 páginas. Enviamos por e-mail uma única vez.
Por que funciona: Define expectativas exatas sobre o que chega e com que frequência.
O plano grátis continua grátis. Faça upgrade só se precisar de mais.
Por que funciona: Responde à pergunta não dita "grátis por quanto tempo?".
Quinze minutos, no horário que for melhor para você.
Por que funciona: Apresenta a conversa como ajuda especializada e limita o tempo.
Aqui os visitantes estão comparando. Cada botão de plano deve dizer o que acontece em seguida naquele plano.
Cobrança mensal. Mude de plano quando quiser.
Por que funciona: Usa o nome do plano para o clique parecer uma escolha consciente.
Você escolhe um plano no dia 14, ou nada acontece.
Por que funciona: Explica o fim do teste, o momento que as pessoas temem.
Inclui tudo do Starter, mais assentos para a equipe.
Por que funciona: Verbo curto mais o plano, com a diferença explicada logo abaixo.
Para 50+ assentos, contratos personalizados ou faturamento.
Por que funciona: Diz para quem é este botão, para que quem não se encaixa o pule.
Pague dez meses, use doze.
Por que funciona: Transforma um desconto em uma conta simples e fácil de conferir.
Seu trabalho e suas configurações atuais são mantidos.
Por que funciona: Para quem já é usuário, o medo é perder trabalho; a microcopy elimina esse medo.
Você pode subir de plano sem perder nada.
Por que funciona: "Comece com" apresenta o plano barato como um primeiro passo, não como uma escolha definitiva.
Um único pagamento. Atualizações desta versão incluídas.
Por que funciona: Para preço de pagamento único, deixa o modelo claro ao lado do botão.
Tabela completa, plano por plano.
Por que funciona: Uma ação secundária para quem ainda não está pronto para escolher.
A maioria das equipes de 5 a 20 pessoas começa por aqui.
Por que funciona: Orientação baseada no perfil, não em popularidade inventada.
O botão de envio é a última coisa lida antes do compromisso. Diga o que o visitante recebe, não o que o formulário faz.
Você recebe por e-mail em até uma hora.
Por que funciona: Troca o "Enviar" pelo resultado e por um prazo.
Próximo passo: escolha um nome de usuário.
Por que funciona: Mostra que há mais uma etapa, para não parecer uma armadilha.
Dias úteis, das 8h às 18h. Não ligamos fora desse horário.
Por que funciona: Respeita o tempo do visitante e deixa claros os limites.
Enviaremos por e-mail o link de acesso e um convite para a agenda.
Por que funciona: Sensação de posse ("minha vaga") mais o que chega em seguida.
Sua pontuação aparece na próxima tela.
Por que funciona: Em quizzes, a recompensa é o resultado, então diga isso.
Uma pessoa de verdade responde, normalmente no mesmo dia.
Por que funciona: Cria uma expectativa humana sem prometer um horário exato.
Um e-mail quando lançarmos. Nada antes disso.
Por que funciona: Uma pequena promessa sobre a quantidade de e-mails reduz o custo de se inscrever.
Leva cerca de 10 minutos. Você pode salvar e terminar depois.
Por que funciona: Duração honesta mais uma rede de segurança para formulários longos.
Funciona no Google Sheets e no Excel.
Por que funciona: Responde a "isso vai funcionar para mim?" no momento do clique.
Cancelamento grátis até 24 horas antes.
Por que funciona: Coloca a regra de cancelamento onde a decisão acontece.
No e-mail, o botão concorre com todas as outras mensagens da caixa de entrada. Seja literal: o leitor precisa saber exatamente para onde o link leva.
Faltam duas etapas. Cerca de três minutos.
Por que funciona: Enquadramento de progresso para um lembrete de onboarding.
Acompanhe a entrega e altere o endereço.
Por que funciona: Lista o que o leitor pode fazer depois de clicar.
Cupom aplicado no checkout. Termina domingo à meia-noite.
Por que funciona: Um prazo real e com data (só se for real).
O Sam fez uma pergunta sobre o seu anúncio.
Por que funciona: Cita a pessoa pelo nome, o que deixa a mensagem mais específica.
Cerca de seis minutos de leitura.
Por que funciona: Em newsletters, o tempo de leitura ajuda a pessoa a decidir entre agora ou depois.
Seu plano termina na data mostrada acima.
Por que funciona: Liga a ação a uma informação que já está no e-mail.
Um toque. Leva dez segundos.
Por que funciona: Pedidos de feedback funcionam melhor quando o esforço é claramente mínimo.
Seu carrinho fica salvo por sete dias.
Por que funciona: Tranquiliza mostrando que nada foi perdido.
Este link expira em 24 horas.
Por que funciona: Transacional: verbo simples, consequência simples.
Seu horário foi alterado. Escolha qualquer horário livre.
Por que funciona: Devolve o controle depois de uma mudança que o leitor não pediu.
Os visitantes estão perto de comprar e procurando motivos para esperar. Elimine esses motivos ao lado do botão.
Devolução grátis em até 30 dias.
Por que funciona: O rótulo padrão que as pessoas procuram, com o principal risco eliminado.
Enviado amanhã se o pedido for feito até as 14h.
Por que funciona: Um horário-limite real de envio dá um motivo para agir hoje.
Use a tabela de medidas ou informe o tamanho que você usa em outras marcas.
Por que funciona: Resolve a hesitação mais comum na compra de roupas.
Um e-mail quando voltar ao estoque.
Por que funciona: Mantém o visitante de um produto esgotado em vez de perdê-lo.
Veja uma prévia da gravação antes de pagar.
Por que funciona: Mostra que o visitante continua no controle do resultado.
Salvo na sua conta, visível em qualquer dispositivo.
Por que funciona: Uma ação mais leve para quem ainda não está pronto para comprar.
Os leitores vieram pelo conteúdo, não por um discurso de vendas. Ofereça mais daquilo que eles já escolheram.
Um e-mail toda quinta-feira. Cancele a inscrição com um clique.
Por que funciona: Frequência e saída informadas logo de cara.
Os passos deste artigo em uma página para imprimir.
Por que funciona: Um material extra diretamente ligado ao que a pessoa acabou de ler.
Dicas práticas para pequenas lojas, duas vezes por mês.
Por que funciona: Uma palavra basta quando a microcopy indica o público e a frequência.
Faça uma cópia na sua própria conta. Grátis.
Por que funciona: Transforma a leitura em ação na hora.
Parte 2: como definir preços.
Por que funciona: Indica o próximo tema para o clique ter uma recompensa clara.
Respondemos às perguntas dos leitores na próxima edição.
Por que funciona: Convida à participação e diz o que acontece com ela.
Novos usuários decidem nos primeiros minutos se vale a pena aprender a usar o produto. Cada botão deve levá-los ao primeiro resultado útil.
Você pode renomear ou excluir depois.
Por que funciona: Elimina o medo de cometer um erro permanente.
De um arquivo CSV ou da sua conta de e-mail.
Por que funciona: Traz dados reais logo no início, o que torna o app útil mais cedo.
Ele terá a mesma visão que você.
Por que funciona: Explica o que o convidado vai ver antes de você enviar o convite.
Você pode fazer isso depois em Configurações.
Por que funciona: Uma saída visível reduz o abandono em etapas opcionais.
Você escolhe o horário. Desativado por padrão.
Por que funciona: Pede permissão deixando o controle com o usuário.
Cinco passos curtos. Feche quando quiser.
Por que funciona: Informa a duração para o tour parecer opcional e curto.
| Fórmula | Padrão | Exemplo |
|---|---|---|
| Verbo + resultado | [Receber / Ver / Começar] + [o que a pessoa quer] | Receber meu orçamento |
| Verbo + "meu" + objeto | A primeira pessoa passa sensação de posse | Planejar minha primeira semana |
| Verbo + objeto + tempo | Acrescenta quanto tempo leva | Receba um preço em 2 minutos |
| Verbo + objeto + redutor de risco | O redutor de risco normalmente vai na microcopy | Começar teste grátis / Sem cartão |
| Próximo passo, com nome | Para fluxos com várias etapas | Continuar para a entrega |
| Pergunta respondida | Reflita o que a pessoa veio procurar | Ver disponibilidade |
Precisa de ideias de título para colocar acima do botão? Experimente o gerador de títulos.
Escolha um verbo, um objeto e uma linha de microcopy para ver o botão e copiar o HTML dele.
CSS puro para um botão principal e um secundário com estados de foco, hover, pressionado e desativado. Ou crie o seu com o gerador de botões CSS e navegue pelos componentes de botão prontos.
.btn {
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 44px;
padding: 0.75rem 1.5rem;
border-radius: 0.5rem;
font: 600 1rem/1.2 system-ui, sans-serif;
text-decoration: none;
cursor: pointer;
transition: background-color 150ms, transform 100ms;
}
.btn-primary {
background: #1d4ed8;
color: #ffffff;
border: 0;
}
.btn-primary:hover { background: #1e40af; }
.btn-primary:active { transform: translateY(1px); }
.btn:focus-visible {
outline: 3px solid #93c5fd;
outline-offset: 2px;
}
.btn-secondary {
background: transparent;
color: #111827;
border: 2px solid #111827;
}
.btn-secondary:hover { background: #111827; color: #ffffff; }
.btn:disabled,
.btn[aria-disabled="true"] {
opacity: 0.5;
cursor: not-allowed;
transform: none;
}O mesmo botão principal com classes do Tailwind:
<a href="/signup" class="inline-flex min-h-[44px] items-center rounded-lg bg-blue-700 px-6 py-3 font-semibold text-white hover:bg-blue-800 active:translate-y-px focus-visible:outline focus-visible:outline-[3px] focus-visible:outline-offset-2 focus-visible:outline-blue-300">
Start your free trial
</a>Para uma seção de fechamento completa em volta do botão, veja os componentes de seção de CTA.
Estas são coisas que vale a pena testar, não previsões de qual versão vai ganhar. Os resultados dependem do seu público e da sua oferta, então teste uma mudança por vez e espere ter visitantes suficientes antes de decidir (a calculadora de teste A/B diz se uma diferença provavelmente é real).
Para ver como as CTAs se encaixam no resto da página, veja o que é uma landing page.
Uma call to action é o botão, link ou formulário que pede ao visitante que dê o próximo passo, como começar um teste, agendar uma ligação ou comprar. Uma boa CTA diz qual é o resultado e começa com um verbo.
Normalmente de duas a cinco. Coloque os detalhes extras, como preço, tempo ou o que acontece em seguida, em uma linha curta de microcopy ao lado ou abaixo do botão, e não no rótulo.
Microcopy é a linha curta ao lado de uma call to action que elimina uma preocupação, por exemplo "Sem cartão" ou "Cancelamento grátis até 24 horas antes". Ela só deve afirmar coisas que são verdadeiras para a sua oferta.
Não existe uma cor melhor que todas. O que importa é que o botão se destaque do fundo e do resto da página, e que o rótulo tenha uma taxa de contraste de pelo menos 4.5:1 com a cor do botão.
Uma página pode repetir a mesma ação principal várias vezes, por exemplo no hero e no final. Evite mostrar duas ações principais diferentes com o mesmo peso na mesma tela; transforme a segunda em um botão com contorno ou em um link de texto.
Verbo
Objeto
Microcopy
Cor
Copiado
Copiar HTML
Comece grátis · Sem cartão de crédito