Site de produto Menta Noirv1.0.0

Site de produto Menta Noir

Crie um site de marketing escuro para um produto de software ou IA: superfícies grafite quase pretas, texto off-white suave, bordas finas e um único destaque menta, com uma palavra de cada título em uma grande serifa itálica. O exemplo usa o produto fictício Corvel, uma equipe de negócios com IA para vendedores online; você troca o conteúdo e mantém a composição que torna o estilo reconhecível.

O que você recebe

Cinco páginas conectadas compartilham uma barra de navegação fixa e um rodapé:

• Produto — uma pílula de anúncio, um título em gradiente de duas linhas, CTAs de download e de navegador, uma fileira de avatares que transmite confiança e uma grande janela do app desenhada em código, com blocos de KPI, um gráfico de receita e uma nota com a principal descoberta. Abaixo vêm uma faixa de integrações, três cards de recursos, uma grade Bento, um depoimento em serifa com números de resultado e um CTA de fechamento com brilho.
• Preços — um seletor mensal/anual que recalcula todos os preços, três planos com o do meio destacado por um brilho, uma tabela comparativa e um FAQ de cobrança.
• Recursos — uma busca na central de ajuda que filtra enquanto você digita, seis cards de categoria, artigos populares, tutoriais por nível e um card de suporte.
• Eventos — um workshop ao vivo em destaque com contagem regressiva e programação, próximas sessões filtráveis, cards de gravações e um formulário de newsletter.
• Novidades — uma linha do tempo de versões cujo nó ativo acompanha a rolagem, cards de versão detalhados e um controle para "carregar versões anteriores".

O pacote também inclui o template, um guia de estilo, uma biblioteca de páginas, regras de ícones, um guia de adaptação a frameworks e um validador local.

Deixe com a sua cara

Comece pelo nome do produto, uma categoria em uma linha e a frase do Hero; depois escolha a palavra que vai virar a serifa menta. Adicione as integrações que o seu produto realmente oferece, três recursos, um caso de cliente com números convincentes e os seus planos. Se ainda não houver artigos de ajuda, eventos ou notas de versão, o assistente pode redigir versões claramente fictícias para você revisar.

Diga ao assistente qual framework você usa ou deixe que ele leia o seu projeto. Sem preferência, ele cria um projeto com Next.js App Router e TypeScript, transformando cada página em uma rota real e cada bloco repetido em um componente.

As fotos se limitam a pessoas: pequenos avatares redondos e um retrato no cartão de identidade do agente. Use fotos da sua equipe ou gere um conjunto coerente sobre um fundo escuro liso, com luz quente e suave.

Confira o resultado

Abra cada página em largura de desktop e de celular. Troque o ciclo de cobrança, pesquise na central de ajuda, filtre os eventos, inscreva-se em uma sessão, aprove a ação do Bento e carregue versões anteriores. Rode o validador incluído em uma versão de arquivo único, ou as verificações do próprio projeto em uma versão com framework. O exemplo não envia dados; conecte serviços reais só onde o seu site de produção precisar.