Estilo Duna
Inspirado na DunaUm documento calmo em papel quente: quase sem cor, letras grandes e apertadas, e uma única pintura de pôr do sol no topo.
A Duna monta a página como um documento sério, mas sem frieza: o fundo é um branco levemente quente, o texto é um quase preto com um fundo de berinjela, e os títulos grandes vêm com as letras bem juntas, num peso normal, sem negrito. Quase tudo fica sem cor; a única cor forte é uma pintura em aquarela de um pôr do sol, que ocupa o topo inteiro e some no branco. Os botões são pílulas escuras, os cartões e as imagens têm cantos bem arredondados, e nada leva sombra: o que separa as partes é o espaço e um fio quase invisível.
A ProfitizeBuild não tem relação com as marcas citadas. Os nomes e os logos só identificam a inspiração.
Fundos
Cada seção do site num destes, com o texto e o acento que vão sobre ele.
Acentos e detalhes
- Berinjela
#1b0624Todo o texto e os títulos: um quase preto com fundo roxo, no lugar do preto puro - Espresso
#160f0cO único botão cheio, em pílula, e a etiqueta de novidade acima do título - Cinza quente
#766a7cO texto de apoio e os parágrafos longos - Pedra
#898683Os rótulos pequenos, os números de apoio e as divisórias - Névoa
#eeeeeeO fundo dos campos de formulário, a única cor que diz "preencha aqui"
Tipografia
A Duna usa a GT America, que é paga e não pode ser distribuída. Aqui e no arquivo vai a Inter, a gratuita mais parecida.
- Título principalInter · 400Clientes novos, sem fila.
- Número em destaqueInter · 4006,2×
- Título de seçãoInter · 400Cada empresa conferida uma vez só.
- Título de cartãoInter · 500Documentos num lugar só
- CorpoInter · 400O cadastro do cliente empresa sai pronto, com cada sócio e cada documento no lugar.
- LegendaInter · 400Mais rápido para abrir uma conta
Componentes
Os botões, o campo e um cartão, desenhados no estilo da marca.
Regras
- Faça
- O fundo da página em linho, o branco quente; o branco puro só nos cartões.
- Títulos grandes em peso normal, com as letras bem juntas.
- Um só botão cheio, em pílula escura; o secundário é a mesma pílula só com o contorno.
- Cantos bem arredondados: 16 px nos cartões, 24 px nas imagens.
- Uma pintura em aquarela no topo como o único momento de cor.
- Números grandes, em três colunas, com uma legenda pequena embaixo.
- Evite
- Nada de azul ou verde nos botões e links: a ação é sempre o quase preto.
- Nada de sombra: o que separa os cartões é o espaço e um fio bem claro.
- Não usar as cores da pintura nos botões, nos ícones ou no texto.
- Nada de seções escuras ou coloridas: a página toda fica clara e quase sem cor.
- Nada de ícones redondinhos e coloridos: só traço fino, na cor do texto.
Movimento
- A pintura do topo aparece num fade lento, sem movimento de câmera.
- Os blocos sobem pouco e devagar com a rolagem, como páginas de um documento.