Apple
Um quarto branco com um único interruptor azul.
O design da Apple é um modelo de contenção: uma tela quase branca, amplo espaço em branco e um único e vibrante toque de azul que faz com que cada ação pareça intencional. O foco principal é a tipografia — SF Pro, com espaçamento negativo entre letras que diminui com o aumento do tamanho, conferindo aos títulos uma clareza arquitetônica sem serem excessivamente pesados. O produto É o design: grandes fotos de produtos e imagens de estilo de vida dominam, enquanto elementos cromados recuam para molduras finas, navegação translúcida e linhas sutis. Seções se alternam em um fundo cinza claro com blocos coloridos para materiais promocionais, criando ritmo por meio de mudanças de escala em vez de elementos decorativos.
O layout da página é de largura total, sem largura máxima fixa para os contêineres — as seções se estendem de ponta a ponta, com os blocos de texto centralizados em aproximadamente 980px. A navegação consiste em uma única barra global fixa, com uma subpasta adicional para cada produto que aparece ao rolar a página. O layout principal é sempre centralizado: um nome de produto grande, um slogan de uma linha, dois botões de menu e, em seguida, uma imagem do produto que preenche o restante da área visível. As seções são empilhadas verticalmente com um espaçamento vertical generoso (mais de 64px entre as seções), alternando entre fundos #f5f5f7 e coloridos. A parte inferior da página consiste em uma única linha horizontal de cartões de serviço de largura total (Apple TV+, Fitness+, Música, Arcade), cada um com um bloco de foto, texto sobreposto e um botão de menu. Sem barras laterais, sem layouts de conteúdo com várias colunas, sem composições assimétricas — tudo é centralizado, empilhado e simétrico.
A fotografia é a linguagem visual dominante. As fotos de produtos são tiradas contra um fundo branco puro ou cinza claro, sem qualquer contexto — o dispositivo É a estrela, isolado e iluminado. As fotos de estilo de vida são exibidas em banners de largura total, frequentemente com objetos recortados de forma precisa. Gradientes de cores (azul pastel, rosa, verde) servem como pano de fundo para as seções de produtos, não como decoração. A iconografia é minimalista e baseada em linhas, com 1 a 2 pixels de espessura, na mesma escala de cinza do texto. Sem ilustrações, sem gráficos abstratos, sem renderizações 3D, exceto pelas próprias fotos dos produtos.
Paleta
Marca
- Apple Blue
#0071e3— Botões de ação preenchidos, estados selecionados - a única cor cromática interativa usada com parcimônia para dar significado a cada aparição. - Link Blue
#0066cc— Bordas de ação destacadas, links incorporados - uma cor mais saturada do que o Azul Apple é usada onde um tablet totalmente preenchido seria muito chamativo. - Signal Blue
#2997ff— Molduras decorativas, contornos de imagens, bordas de ícones - a cor azul mais clara do sistema, usada para criar atmosfera em vez de para interação com o usuário.
Neutro
- Carbon
#1d1d1f— O texto principal, as margens dos títulos, as linhas de navegação e as bordas dos cartões têm como cor predominante o preto, com um ligeiro toque de cor quente. - Frost
#f5f5f7— A tela da página, o fundo do texto principal e a superfície do rodapé são em um tom de cinza claro característico da Apple, um pouco mais frio que o branco puro. - Ice
#f4f8fb— Preenchimentos expressivos na superfície, tonalidades sutis, texto em botões sobre um fundo escuro — um tom azul discreto que anima a seção sem torná-la chamativa. - Smoke
#333333— Texto secundário, preenchimento de navegação, bordas de botões - Uma cor neutra e versátil para bordas e ícones que precisam de mais destaque do que um cinza médio. - Graphite
#474747— Texto de navegação, bordas de navegação, bordas de links - ocupa uma posição intermediária entre Carbono e Fumaça na hierarquia de elementos. - Ash
#707070— Texto do rodapé, bordas da lista, bordas da navegação, texto do corpo em tom discreto - Um cinza médio para conteúdo que precisa estar presente, mas não em destaque.
Tipografia
de 12 a 56px · 8 etapas
- SF Pro Display — substituição: Inter · esboços 400, 600, 700 · Títulos e textos grandes — tamanhos acima de 40px usam um formato de exibição com abertura menor e espaçamento negativo mais acentuado; 700px é reservado para layouts de publicidade e 400px para nomes de produtos em conteúdo editorial.
- SF Pro Text — substituição: Inter · esboços 300, 400, 600 · Texto principal, navegação, botões, subtítulos — fonte de trabalho; 400 para texto principal, 300 para subtítulos e rótulos qualificados, 600 para elementos de navegação e texto de botões; o espaçamento entre letras negativas diminui proporcionalmente ao tamanho (de -0,022em a 12px para -0,01em a 44px).
Intervalos e forma
| Propósito | Significado |
|---|---|
| Densidade | média |
| Passo básico | 12px |
| Raio do botão | 980px |
| Raio do cartão | 8px |
| Sombras | não - bordas em vez de sombras |
| Entre seções | 64px |
| Largura da página | 1440px |
A IA criará seu site no estilo Apple e o preencherá.
- Compartilhe produtos e publicações através dos links - Instagram, TikTok, Facebook.
- Transfira o conteúdo do seu site antigo — basta especificar o endereço.
- Design moderno na melhor engine: React ( Next.js) com renderização no servidor e otimização de SEO integradas.
- Otimização de SEO totalmente automatizada para resultados de pesquisa e recomendações de redes neurais.
Estilos semelhantes
- Ui — Plano clínico em papel fosco
- ElevenLabs — Um ensaio fotográfico em tons creme quentes com títulos sutis. Um caderno em estilo Bauhaus — papel cor de casca de ovo, tinta preta e um único detalhe em roxo e laranja para exibição do produto.
- monopo saigon — Um brilho líquido e iridescente por trás do silêncio editorial — uma galeria editorial monocromática flutuando em luz incandescente.
- Awesomic — Tela editorial em zinco com marcas de pontuação laranja que lembram confete.
- Monad — revista técnica editorial sobre pergaminho quente
- Dub — Painel de controle de papel de arroz fosco do Link
- Seline Analytics — Uma mesa analítica silenciosa sobre papel quente
- Ventriloc — Um observatório editorial de dados em papel morno – uma única brasa alaranjada destacando a precisão monocromática.
- Duolingo — Mascote lúdico da turma em papel branco
- Stripe — Um livro de contabilidade escrito com tinta índigo sobre vidro fosco.
- Notion — Um caderno de papel quente sob o sol do meio-dia
- Hyer Aviation — Crepúsculo na cabine de pilotagem sobre pergaminho. O céu pálido da aurora encontra o logotipo serifado do tamanho da fuselagem, e um único detalhe em tom de barro quente quebra a sobriedade monocromática.