Stylepack

Fontes

As fontes que o apple.com usa

O apple.com usa SF Pro Text nos títulos e no texto corrido. SF Pro Text é uma fonte do sistema: já vem com o sistema operacional, sem nada para carregar.

Medido no apple.com há 4 dias.

Abrir o pacote de design completoBaixar o pacote

Famílias de fontes

2 famílias
SF Pro Text
Usada em
h1, h3, label, button, body
Origem
sistema
Alternativa gratuita
Já é gratuita
SF Pro Display
Usada em
h2, body
Origem
sistema
Alternativa gratuita
Já é gratuita

CSS para reproduzir

Variáveis de fonte com a substituta gratuita na pilha, para que o mesmo CSS funcione com ou sem a fonte licenciada.

fonts.css
:root {
  --font-heading: "SF Pro Text", sans-serif;
  --font-body: "SF Pro Text", sans-serif;
  --font-size-base: 12px;
}

Como o texto é composto

headline-displayQuick brown foxSF Pro Text / 34px / 600 / lh 50px / -0.374px
headline-lgQuick brown foxSF Pro Display / 56px / 600 / lh 60px / -0.28px
headline-mdQuick brown foxSF Pro Text / 12px / 600 / lh 16.0005px / -0.12px
body-mdThe quick brown fox jumps over the lazy dogSF Pro Text / 12px / 400 / lh 16.0005px / -0.12px
label-mdThe quick brown fox jumps over the lazy dogSF Pro Text / 12px / 400 / lh 1.33 / -0.12px
buttonThe quick brown fox jumps over the lazy dogSF Pro Text / 14px / 400 / lh 1.29 / -0.224px
Tamanhos de fonte em uso
1214172128344056

Para agentes de IA

O pacote é texto puro, sem chave: busque o DESIGN.md ou entregue o pacote inteiro ao Claude Code, Cursor ou Copilot pelo servidor MCP.

curl -s https://stylepack.ai/packs/apple.com/DESIGN.md

Perguntas

Qual fonte o apple.com usa?

O apple.com usa SF Pro Text, SF Pro Display. Os títulos são compostos em SF Pro Text e o texto corrido em SF Pro Text, medidos no site como ele é renderizado, não lidos da folha de estilos.

A fonte do apple.com é gratuita?

Sim. SF Pro Text, SF Pro Display pode ser usada no seu próprio site sem comprar licença: carregue do Google Fonts, ou conte com a fonte do sistema onde é isso que o apple.com usa.

Como ter a mesma tipografia do apple.com no meu projeto?

Baixe o pacote de design do apple.com no Stylepack: ele traz a pilha de fontes, a escala tipográfica, todos os estilos de texto e as capturas de tela, em um formato que um agente de código com IA, como Claude Code ou Cursor, consegue usar para construir.