Template de site
Hugoplate
Hugoplate é um template inicial gratuito construído com Hugo e TailwindCSS, fornecendo tudo o que você precisa para acelerar seu projeto Hugo e economizar um tempo valioso.
Landing page · Portfólio · Grátis
Páginas
Capturas da demonstração, página por página. Role dentro de cada página para vê-la inteira.
Análise do design
Uma leitura feita por IA do design deste template: cores, tipografia, espaçamento, seções e detalhes marcantes. O Ottermind parte dela quando você usa o template.
- Visão geral
página de destino, limpa e minimalista, baixa densidade, clara
- Paleta
fundo #ffffff; superfícies [#1f2937]; texto #1f2937; texto abafado #6b7280; primária #1f2937; acentos []
- Tipografia
títulos Inter, 700, caixa de frase; corpo Inter, 16px; escala h1 48px, h2 36px, h3 28px
- Forma e espaçamento
raio do botão 6px, sem bordas, sombra suave em botões, espaçamento entre seções 80px, largura do conteúdo 1200px máximo
- Seções (de cima para baixo)
- Cabeçalho — layout horizontal, logotipo à esquerda, navegação central-direita com Início, Sobre, Elementos, Menu suspenso Páginas, ícone de pesquisa, alternador de modo escuro, botão Github; fundo branco
- Hero — layout centralizado, coluna única, título grande, subtítulo, botão CTA "Fork Deploy and Edit Online" com emoji de foguete, ilustração em preto e branco abaixo; fundo branco
- Rodapé — não visível na captura de tela
- Detalhes marcantes
- Ilustração em linha monocromática de uma pessoa em uma mesa com laptop, luminária, relógio, planta e xícara de café
- Design minimalista com alto contraste entre texto/linhas pretas e fundo branco
- Cantos arredondados em todos os elementos interativos
- Hierarquia tipográfica limpa usando a família de fontes Inter
- Efeito de passagem do mouse sutil nos itens de navegação e botões
- Alternador de modo escuro com ícone de sol/luar
- Outras páginas
- /about: breve biografia e detalhes do projeto
- /elements: demonstração de componentes de interface
- /pages: layouts de exemplo de páginas
Detalhes do template
- Categoria
- Landing page, Portfólio, Blog, Kit inicial
- Feito com
- Hugo
- Licença
- MIT
- Autor
- Zeon Studio
- Publicado em
- Hugo Themes
- Preço
- Grátis
- blog
- contact
- dark
- dark-mode
- landing
- light
- minimal
- multilingual
- personal
- tailwind
Design original de Zeon Studio, publicado no Hugo Themes. O Ottermind não copia o código do template: ele cria um site novo a partir do briefing.
O briefing de onde o Ottermind parte
Ele abre no Studio como rascunho — acrescente sua marca, público e páginas antes de enviar.
Construa um website landing page inspirado no template "Hugoplate". Briefing de referência: Hugoplate é um template inicial gratuito construído com Hugo e TailwindCSS, fornecendo tudo o que você precisa para acelerar seu projeto Hugo e economizar um tempo valioso. Estilo e funcionalidades a refletir: blog, contato, dark, dark-mode, landing, light. Use copy e imagens originais para minha marca ao invés do conteúdo placeholder da referência.
Como usar este template
- 1
Clique em “Usar este template” para abri-lo no Ottermind Studio com o briefing preenchido.
- 2
Acrescente ao briefing sua marca, público, páginas e conteúdo.
- 3
O Ottermind cria um site novo inspirado neste design — continue ajustando pelo chat.
