Apple (España)
Una catedral de espacio en blanco con titulares apenas audibles. Un vasto y luminoso salón donde enormes fuentes tipográficas de 700 caracteres cuelgan en el aire, unidas únicamente por colores pastel y un solo hilo azul.
El lenguaje de las páginas de productos de Apple es un ejemplo de generosidad tipográfica: enormes titulares de SF Pro Display que destacan sobre un fondo blanquecino, rodeados de un amplio espacio en blanco que hace que cada palabra parezca deliberada. La paleta es casi monocromática: texto en #1d1d1f, lienzo alternando entre #ffffff y #f5f5f7, con un único acento azul (#0071e3) reservado exclusivamente para momentos interactivos. El color está presente en las propias imágenes de los productos (tonos pastel), nunca como elementos decorativos de la interfaz de usuario. Los componentes no tienen marco: tarjetas redondeadas con un radio de 28 px, botones en forma de píldora que casi tocan los bordes de la página, sin contenedores visibles ni sombras. El ritmo se crea mediante franjas blancas y grises alternadas, no con divisores ni bordes.
Las secciones ocupan todo el ancho de la página, extendiéndose de borde a borde con un relleno generoso (aproximadamente 40-100 lados). El ancho máximo del contenido está efectivamente centrado dentro de cada tira. El elemento principal es una pila centrada: una etiqueta en forma de ceja, un titular ampliado, un único botón de llamada a la acción, una fila de precios y, a continuación, una imagen del producto que llena la parte inferior de la ventana gráfica. Las secciones siguen un patrón repetitivo: un titular alineado a la izquierda dentro de la tira, seguido de un diseño de dos columnas con descripciones de productos (texto a la izquierda/imagen a la derecha o alternando), una cuadrícula de tarjetas de tres columnas o una muestra visual centrada. El ritmo del contenido está totalmente controlado por fondos blancos y tricolores alternados con espacios verticales de 100-100 cm; sin divisores, sin tarjetas que contengan elementos. La navegación global es una única barra fija. Las secciones de especificaciones del producto utilizan bandas de ancho completo con un relleno generoso, donde el texto está centrado en columnas estrechas (~560px) sobre un área visual más amplia.
El lenguaje visual de Apple se basa principalmente en la fotografía de producto: primeros planos del hardware sobre un fondo blanco puro o de color, sin contexto de estilo de vida ni escenas preparadas. La imagen principal muestra unas manos sosteniendo un MacBook Neo verde pastel; el elemento humano es secundario, mostrando escala y textura en lugar de emoción. En las secciones de variantes de producto, se presentan dos dispositivos uno al lado del otro sobre un fondo con colores de acabado a juego (rosa, verde, plata, azul cielo), cada tarjeta es un campo de color plano con el producto en el centro. Las tomas de detalle utilizan primeros planos extremos (la bisagra del portátil, el módulo de la cámara) sobre un fondo neutro. No hay ilustraciones, ni gráficos abstractos, ni imágenes decorativas; el producto en sí es el elemento visual. La iconografía está presente por todas partes: iconos de línea monocromáticos al estilo de SF Symbols, de 1,5 a 2 píxeles de grosor, tomados del conjunto de iconos del sistema de Apple. La fotografía siempre se realiza con una iluminación de clave alta: iluminación uniforme y sin sombras que reduce el producto a una forma gráfica en lugar de un objeto tridimensional.
Paleta
Marca
- Electric Blue
#0071e3— Los botones de acción rellenos son el único elemento de color en la interfaz de usuario, y se utilizan con moderación para las llamadas a la acción. - Link Blue
#0066cc— Enlaces de texto en línea, enlaces con flechas y galones. - Citrus Gradient
#3b3b23— Un acabado alternativo que se ha convertido en el sello distintivo del producto es una base oscura que se difumina en reflejos amarillo verdosos.
Neutral
- Primary Ink
#1d1d1f— Los titulares, el texto principal y las etiquetas de los botones son el tono dominante en primer plano en todas las superficies; el fondo de la imagen principal del producto pasa suavemente de un color sólido #1d1d1f en la parte superior a un azul cromático. - Mid Gray
#707070— Texto secundario, estado de navegación inactivo, etiquetas de interfaz de usuario silenciadas - Deep Gray
#474747— El texto y la iconografía de navegación están en una fuente de tamaño mediano. - Hairline
#d6d6d6— Límites finos entre secciones y elementos de la interfaz de usuario. - Canvas
#f5f5f7— Fondos de sección alternos: una franja gris que separa las áreas blancas. - Paper
#ffffff— Superficie de la tarjeta, fondo de la página principal, texto del botón sobre un fondo oscuro.
Tipografía
de 12 a 96 píxeles · 10 pasos
- SF Pro Display — reemplazo: Inter · esquemas 600, 700 · Títulos y subtítulos principales para visualización: 700 de grosor a 80–96px con espaciado entre letras negativo de -1,44px crea el característico "título enorme flotando en blanco" de Apple. Sustitutos: Inter, system-ui
- SF Pro Display — reemplazo: Inter · esquemas 600 · Encabezados de sección, títulos de tarjetas, subtítulos: una fuente de 600 con un espaciado entre letras ligeramente positivo transmite calidez y amabilidad en tamaños medianos, a diferencia de los encabezados cortos mencionados anteriormente.
- SF Pro Text — reemplazo: Inter · esquemas 400, 500, 600 · Para el texto principal, la navegación, los párrafos de apoyo y los subtítulos pequeños, se utiliza una fuente con un índice de 400 y un tamaño de 17 píxeles. El espaciado negativo entre letras permite una presentación más concisa del texto principal en páginas con mucha información.
Intervalos y forma
| Objetivo | Significado |
|---|---|
| Densidad | denso |
| Paso básico | 8-10px |
| Radio del botón | 980px |
| Radio de la tarjeta | 28px |
| Oscuridad | no - bordes en lugar de sombras |
| Entre secciones | 100-120px |
| Ancho de página | 1200px |
La IA construirá tu sitio web al estilo de Apple (España) y lo rellenará.
- Rellena con productos y publicaciones a través del enlace - Instagram, TikTok, Facebook.
- Transfiere el contenido de tu antiguo sitio web; solo tienes que especificar la dirección.
- Diseño moderno sobre el mejor motor: React ( Next.js) con renderizado del lado del servidor y optimización SEO integrada.
- Optimización SEO totalmente automatizada para resultados de búsqueda y recomendaciones mediante redes neuronales.
Estilos similares
- Airbnb — Una tranquila pared blanca de la galería con un único marcapáginas de color rojo coral.
- Peak Design — Pared de la galería, parcialmente iluminada
- Ramp — El departamento de finanzas editoriales, páginas en blanco y negro con un único rotulador de neón. La superficie prácticamente monocromática de la publicación, donde un único trazo verde lima brillante transforma cada interacción en una señal monetaria.
- 099 SUPPLY — Una pared de galería llena de objetos en blanco y negro.
- Orderful — Panel de control de logística industrial: una lista de verificación impresa para el despachador de logística, realizada en tinta negra y rojo quirúrgico, con cada página lo suficientemente discreta como para permitir que un operador grite algo importante.
- Apple (España) — Vitrina blanca para galería
- teenage engineering — Catálogo industrial de iluminación de estudio: el producto es el único elemento significativo de la página, y todo lo demás se discute a su alrededor.
- Apple (España) — Una ventana de galería en la niebla matutina
- Lightship — Un diorama cinematográfico de la carretera abierta. Paredes de color crema cálido adornadas con grandes fotografías de paisajes montadas a intervalos cortos, letras negras finas apenas visibles en los marcos y un único toque de naranja brillante que rompe la monotonía como una hoguera en un prado.
- Custo — Una galería color gris plomo con una tipografía monolítica. Una sala de exposiciones en tonos gris verdosos apagados, donde un único objeto oscuro y una tipografía de 57 píxeles hablan por sí solos.
- Silencio — Una habitación blanca con objetos suspendidos en el aire. Una exposición de arte hecha de papel cálido, donde cada elemento ocupa su lugar sobre un fondo de volumen negativo, y el silencio es una decisión de diseño intencionada.
- ORYZO AI — Un reportaje fotográfico sobre un cuarto oscuro. Un objeto solitario flotando en la cálida oscuridad, con una tipografía color crema como única decoración.