body { margin: 0; font-family: Arial, Helvetica, sans-serif; color: #222; background-color: #f5f7fb; } .hero { background: linear-gradient(135deg, #4c6fff, #6a9bff); color: #fff; padding: 60px 20px 80px 20px; text-align: center; } .hero-inner { max-width: 900px; margin: 0 auto; } .hero-logo { font-weight: 700; letter-spacing: 1px; font-size: 22px; margin-bottom: 30px; } .hero h1 { font-size: 40px; margin: 0 0 20px 0; } .hero p.subtitle { font-size: 18px; margin: 0 0 30px 0; opacity: 0.95; } .hero-cta { margin-top: 10px; } .btn-primary { display: inline-block; padding: 14px 28px; border-radius: 6px; border: none; background-color: #ffffff; color: #2950ff; font-weight: 600; font-size: 15px; cursor: pointer; text-decoration: none; box-shadow: 0 10px 25px rgba(0,0,0,0.15); } .btn-secondary { display: inline-block; padding: 12px 22px; border-radius: 6px; border: 1px solid rgba(255,255,255,0.7); background-color: transparent; color: #ffffff; font-weight: 500; font-size: 14px; cursor: pointer; text-decoration: none; margin-left: 10px; } .hero-note { margin-top: 18px; font-size: 13px; opacity: 0.9; } .section { padding: 50px 20px; } .section.light { background-color: #ffffff; } .section-title { text-align: center; font-size: 26px; margin-bottom: 10px; } .section-subtitle { text-align: center; font-size: 15px; color: #555; margin-bottom: 40px; } .features { max-width: 1000px; margin: 0 auto; display: flex; flex-wrap: wrap; gap: 25px; justify-content: center; } .feature-card { background-color: #f8f9ff; border-radius: 10px; padding: 22px 20px; flex: 1 1 260px; max-width: 310px; box-shadow: 0 4px 12px rgba(22,34,86,0.06); } .feature-title { font-size: 16px; font-weight: 600; margin-bottom: 8px; } .feature-text { font-size: 14px; color: #555; line-height: 1.6; } .badge { display: inline-block; font-size: 11px; text-transform: uppercase; letter-spacing: 0.08em; padding: 4px 9px; border-radius: 999px; background-color: rgba(76,111,255,0.1); color: #2950ff; margin-bottom: 10px; } .grid-2 { max-width: 1000px; margin: 0 auto; display: flex; flex-wrap: wrap; gap: 40px; align-items: center; } .col { flex: 1 1 300px; } .mockup-box { background-color: #0f172a; border-radius: 14px; padding: 18px; color: #e5e7eb; box-shadow: 0 18px 40px rgba(15,23,42,0.7); } .mockup-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 14px; font-size: 12px; } .mockup-dot { width: 8px; height: 8px; border-radius: 999px; background-color: #f87171; display: inline-block; margin-right: 4px; } .mockup-dot.yellow { background-color: #facc15; } .mockup-dot.green { background-color: #4ade80; } .mockup-code { background-color: #020617; border-radius: 10px; padding: 14px; font-family: "Courier New", monospace; font-size: 11px; line-height: 1.7; overflow-x: auto; white-space: pre; } .highlight { color: #4ade80; } .cta-section { background: linear-gradient(135deg, #111827, #1f2937); color: #f9fafb; text-align: center; padding: 50px 20px 60px 20px; } .cta-inner { max-width: 620px; margin: 0 auto; } .cta-inner h2 { font-size: 26px; margin-bottom: 12px; } .cta-inner p { font-size: 15px; color: #e5e7eb; margin-bottom: 25px; } .cta-small { font-size: 12px; color: #9ca3af; margin-top: 14px; } footer { text-align: center; padding: 18px 10px 26px 10px; font-size: 12px; color: #6b7280; background-color: #f3f4f6; } footer a { color: #4b6bfb; text-decoration: none; } @media (max-width: 768px) { .hero h1 { font-size: 30px; } .hero p.subtitle { font-size: 16px; } .grid-2 { flex-direction: column; } .btn-secondary { margin-top: 10px; margin-left: 0; display: block; } }
Gere páginas em segundos

Crie Landing Pages profissionais usando apenas texto.

Descreva o seu produto em poucas linhas e receba um HTML completo, responsivo e pronto para publicar. Sem código complexo, sem dependências externas.

Nenhuma instalação necessária. Apenas copie e cole o código gerado.

Por que usar o LandingBuilder?

Pensado para empreendedores, agências e criadores que precisam lançar rápido sem abrir mão de qualidade.

HTML limpo e válido

Código completo com , e , seguindo boas práticas de semântica e estrutura. Compatível com os principais navegadores.

Apenas HTML + CSS inline

Sem JavaScript, sem arquivos externos, sem dependência de frameworks. Ideal para e-mails, construtores simples e hospedagens limitadas.

Focado em conversão

Seções otimizadas para apresentar proposta de valor, benefícios e chamadas para ação, ajudando você a transformar visitantes em clientes.

Totalmente customizável

Edite textos, cores e estilos diretamente no HTML. Ajuste ao seu branding em minutos, sem precisar de ferramentas avançadas.

Exemplo de saída

De uma ideia em texto para uma página pronta em um passo.

Você só precisa descrever o objetivo da sua página: lançar um curso, validar um produto, capturar leads ou apresentar um serviço. Em seguida, o LandingBuilder devolve um código HTML pronto, com seções de herói, benefícios, prova social e chamada para ação.

Copie, cole no seu editor ou CMS favorito e publique em poucos minutos, sem depender de desenvolvedores ou templates genéricos.

index.html
Minha Landing Page

Lance seu produto em dias, não meses.

Quero testar
Comece em menos de 1 minuto

Pronto para gerar sua próxima Landing Page?

Escreva uma descrição como: “Quero uma página para vender um curso online de fotografia para iniciantes, com destaque para bônus e garantia”. Em seguida, peça o HTML e cole no seu editor.

Descrever meu projeto
Não há limite de ideias: gere quantas variações quiser e teste o que converte melhor.