Hero com formulário de captura

Hero — bloco Tailwind pronto a copiar.

Instalação

Bloco em HTML + Tailwind — sem dependências de build. Copie e cole diretamente no seu projeto.

html

<section class="bg-white py-24 px-6">
  <div class="max-w-2xl mx-auto text-center">
    <h1 class="text-4xl font-bold text-gray-900 mb-4">Entre na lista de espera</h1>
    <p class="text-lg text-gray-500 mb-8">Seja o primeiro a experimentar quando lançarmos.</p>
    <form class="flex flex-col sm:flex-row gap-3 max-w-md mx-auto">
      <input type="email" placeholder="o.seu@email.com" class="flex-1 border border-gray-300 rounded-lg px-4 py-3 text-sm outline-none focus:border-gray-900" />
      <button class="bg-gray-900 text-white font-semibold px-6 py-3 rounded-lg hover:bg-black">Inscrever</button>
    </form>
    <p class="text-xs text-gray-400 mt-4">Já são +3.200 pessoas na lista.</p>
  </div>
</section>