Hero com gradient background

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="relative overflow-hidden py-28 px-6 bg-gray-950">
  <div class="absolute inset-0 bg-gradient-to-br from-indigo-900/40 via-gray-950 to-gray-950"></div>
  <div class="relative max-w-3xl mx-auto text-center text-white">
    <h1 class="text-5xl font-bold mb-5">Escale a sua infraestrutura sem medo.</h1>
    <p class="text-lg text-gray-300 mb-9">Deploys automáticos, observabilidade nativa, zero downtime.</p>
    <a href="#" class="bg-white text-gray-950 font-semibold px-7 py-3.5 rounded-lg inline-block hover:bg-gray-200">Criar conta grátis</a>
  </div>
</section>