Stylepack

Fuentes

Las fuentes que usa apple.com

apple.com compone sus titulares y su texto de cuerpo en SF Pro Text. SF Pro Text es una fuente del sistema: viene con el sistema operativo, no hay nada que cargar.

Medido en apple.com hace 4 días.

Abrir el paquete de diseño completoDescargar el paquete

Familias tipográficas

2 familias
SF Pro Text
Se usa para
h1, h3, label, button, body
Origen
sistema
Alternativa gratuita
Ya es gratuita
SF Pro Display
Se usa para
h2, body
Origen
sistema
Alternativa gratuita
Ya es gratuita

CSS para reproducirlo

Variables de fuente con la alternativa gratuita en la pila, así el mismo CSS funciona con o sin la fuente con licencia.

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

Cómo se compone el texto

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
Tamaños de fuente en uso
1214172128344056

Para agentes de IA

El paquete es texto plano, sin clave: descarga DESIGN.md o entrega el paquete completo a Claude Code, Cursor o Copilot con el servidor MCP.

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

Preguntas

¿Qué fuente usa apple.com?

apple.com usa SF Pro Text, SF Pro Display. Los titulares van en SF Pro Text y el texto de cuerpo en SF Pro Text, medido en el sitio tal como se renderiza, no leído de su hoja de estilos.

¿La fuente de apple.com es gratuita?

Sí. Puedes usar SF Pro Text, SF Pro Display en tu propio sitio sin comprar una licencia: cárgala desde Google Fonts, o usa la fuente del sistema donde eso es lo que usa apple.com.

¿Cómo consigo la misma tipografía que apple.com en mi proyecto?

Descarga el paquete de diseño de apple.com en Stylepack: contiene la pila de fuentes, la escala tipográfica, cada estilo de texto y las capturas, en un formato con el que un agente de programación con IA como Claude Code o Cursor puede construir.