Aqui está a versão mais detalhada do prompt/script que você pode usar para gerar uma landing page completa e responsiva, similar à da tal — ideal para o Lovable.
Crie uma landing page moderna, responsiva e otimizada para conversão, inspirada na estrutura visual e de UX do site https://site.com.
A página deve seguir o padrão de uma empresa de dedetização e sanitização profissional, com linguagem clara, foco confiança, limpeza e agilidade no atendimento.
🎨 Paleta de cores:
- Cor primária: azul (#007BFF) ou verde-limão (#00A859).
- Cor secundária: branco (#FFFFFF).
- Cor de apoio: cinza claro (#F5F5F5) e cinza escuro (#333333).
- Cores de destaque: amarelo claro (#FFC107) ou laranja suave (#FFA726) para botões CTAs.
🖋️ Tipografia:
- Fontes limpas e legíveis (ex: Poppins, Inter ou Lato).
- Títulos em bold, corpo de texto regular.
📱 Layout responsivo:
- Ajuste fluido e responsivo para telas de desktop, tablet e celular.
- Teste principal: mobile first.
-
Barra superior fina com:
- Telefone (ícone de telefone + número: “(61) xxxx-xxxx — Atendimento 24h”).
- Endereço: “xxxxxxxxxxxxxxx”.
- Ícones pequenos de redes sociais (Facebook, Instagram, WhatsApp).
-
Abaixo, logo da empresa à esquerda e botões à direita:
- “Sobre nós”
- “Serviços”
- “Depoimentos”
- “Contato”
- Botão CTA em destaque: “Fale pelo WhatsApp” (com ícone e fundo verde).
-
Fundo com imagem de profissional dedetizando ou ambiente limpo (sem exageros).
-
Título forte e direto: “Dedetização e Sanitização Profissional em Brasília”
-
Subtítulo explicativo: “Atendimento rápido, produtos certificados pela ANVISA e garantia total de serviço.”
-
Dois botões de CTA:
- “Fale com um especialista no WhatsApp”
- “Solicitar orçamento gratuito”
-
Ao lado direito ou logo abaixo (no mobile):
-
Formulário rápido com os campos:
- Nome completo
- Telefone (com máscara para WhatsApp)
- Tipo de serviço (select: dedetização, sanitização, desentupimento, limpeza de reservatório)
- Botão “Enviar solicitação”
-
Mostrar ícones de segurança (ex: selo SSL, “Atendimento 100% seguro”).
-
-
Título centralizado: “Nossos Serviços”
-
Grid de 4 colunas (2x2 no mobile):
-
Dedetização
- Ícone de inseto com X.
- Texto: “Eliminamos baratas, formigas, cupins e pragas urbanas com segurança e eficácia.”
-
Sanitização de Ambientes
- Ícone de spray ou escudo.
- Texto: “Remoção de vírus, fungos e bactérias com produtos certificados pela ANVISA.”
-
Desentupimento
- Ícone de encanamento.
- Texto: “Soluções rápidas e limpas para pias, ralos e esgotos.”
-
Limpeza de Reservatórios
- Ícone de caixa d’água.
- Texto: “Higienização completa de caixas d’água com laudo técnico e selo de qualidade.”
-
-
Pequeno botão abaixo: “Solicite seu orçamento agora”.
-
Fundo cinza-claro (#F8F9FA).
-
Título: “Por que escolher a Dedetizadora X?”
-
Quatro colunas (com ícones vetoriais grandes):
- 🧪 “Produtos Certificados pela ANVISA e Bayer”
- 🚫 “Sem cheiro, sem sujeira, sem bagunça”
- ⚙️ “Serviços rápidos e garantia estendida”
- 📄 “Contratos flexíveis — sem fidelização”
-
Adicionar selo “Mais de 15 anos de experiência”.
- Fundo branco, título central: “Empresas que confiam em nós”
- Grid com logotipos de clientes (Atacadão, Assaí, Liberty, Record TV etc.).
- Pequena legenda: “Atendemos empresas de todos os portes.”
- Fundo azul-claro.
- Imagem da equipe ou veículo da empresa à esquerda, texto à direita.
- Título: “Sobre a Dedetizadora X”
- Texto: “Somos referência em controle de pragas e higienização de ambientes em Brasília e região. Atuamos com tecnologia, uipe qualificada e produtos certificados, garantindo a segurança de lares, empresas e indústrias.”
- Botão: “Saiba mais sobre nossa história”.
-
Fundo branco.
-
Título: “O que nossos clientes dizem”
-
Carrossel de 3 depoimentos:
- Nome, cidade e estrelas ⭐⭐⭐⭐⭐
- Texto curto de avaliação.
- (Opcional) Foto do cliente ou ícone de avatar.
-
Título: “Dúvidas Frequentes”
-
Accordion com 5 perguntas:
- “Como me preparo para uma dedetização?”
- “O cheiro do produto é forte?”
- “Em quanto tempo posso voltar ao ambiente?”
- “Vocês atendem condomínios e empresas?”
- “Há garantia no serviço?”
-
Cada resposta curta e objetiva.
-
Fundo escuro (#212529).
-
Dividido em 3 colunas:
-
Coluna 1: Logo + breve descrição da empresa.
-
Coluna 2: Links úteis (Serviços, Sobre nós, Dúvidas, Contato).
-
Coluna 3: Contato direto:
- Telefone fixo e WhatsApp
- Endereço físico
- Horário de atendimento
-
-
Linha inferior com © Direitos reservados, ano dinâmico e aviso de cookies.
- Botão flutuante do WhatsApp (fixo no canto inferior direito).
- Botão de “voltar ao topo”.
- Animações suaves com Scroll Reveal (fade-in / slide).
- Meta tags para SEO (title, description, schema.org).
- Microcopy humanizado: “Fale agora e livre-se das pragas hoje mesmo.”
- Formulário validado via JS + feedback visual.
- PageSpeed otimizado (lazy load, imagens WebP).
Saída esperada: Gere o código HTML + Tailwind CSS, limpo e sem comentários, com a estrutura acima implementada. Se preferir, gere como um componente React/Vue/Svelte equivalente.
Quer que eu gere o HTML + Tailwind completo baseado exatamente nesse prompt (com classes já configuradas e sem comentários)?