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
site de documentação, limpo e profissional, baixa densidade, claro
- Paleta
fundo #f5f5f5; superfícies #ffffff, #f9f9f9; texto #1a1a1a; texto suavizado #666666; primário #0066cc; destaques #0099ff, #333333
- Tipografia
títulos Inter, 700, maiúsculas; corpo Inter, 16px; escala h1 48px, h2 36px, h3 24px
- Forma e espaçamento
raio do botão 6px, raio do cartão 8px, bordas 1px solid #e0e0e0, sombras 0 2px 4px rgba(0,0,0,0.1), espaçamento entre seções 80px, largura do conteúdo 1200px
- Seções (de cima para baixo)
- Hero — layout em largura total, coluna única, manchete grande centralizada, dois botões CTA abaixo, fundo com gradiente de #f5f5f5 para #e0e0e0
- Recursos — grade de três colunas, cada uma com ícone, título e parágrafo curto, cartões brancos sobre fundo cinza-claro
- Documentação — layout de duas colunas, barra lateral esquerda com lista de navegação, área principal direita com títulos aninhados e blocos de código
- Depoimentos — linha horizontal rolável de cartões de citação com imagens de avatar, alinhamento alternado
- Rodapé — coluna única, linha com logotipo, links agrupados em colunas, linha de direitos autorais
- Detalhes marcantes
- Letras hexagonais no logotipo do cabeçalho
- Uso consistente de cantos arredondados em todos os elementos da interface
- Sombras sutis em cartões e botões
- Blocos de código com fonte monoespaçada e realce de sintaxe
- Efeitos ao passar o mouse em elementos interativos (botões, itens de navegação)
- Hierarquia tipográfica limpa e minimalista com espaçamento consistente
- Outras páginas
- /docs: documentação estruturada com navegação na barra lateral e seções recolhíveis
- /blog: lista de artigos com imagem em destaque, título, trecho e link "ler mais"
- /about: seção da equipe com cartões de perfil e declaração de missão
Detalhes do template
- Categoria
- Site
- Feito com
- Hugo
- Publicado em
- Hugo Themes
- Preço
- Grátis
Design original de Hugo Themes, 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.
Crie um site inspirado no template "Docsy". Briefing de referência: Tema Use textos e imagens originais para minha marca, em vez 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.
