
Apple (España)
Собор белого пространства с едва слышными заголовками. Огромный светлый зал, где в воздухе висят огромные шрифты 700-й плотности, скрепленные лишь пастельными цветами и единственной синей нитью
Язык страниц продуктов Apple — это образец типографической щедрости: огромные заголовки SF Pro Display, парящие на почти белом фоне, окруженные огромным пустым пространством, благодаря которому каждое слово кажется продуманным. Палитра почти монохромная — текст на #1d1d1f, холст, чередующийся между #ffffff и #f5f5f7 — с единственным синим акцентом (#0071e3), зарезервированным исключительно для интерактивных моментов. Цвет присутствует в самих изображениях продукта (пастельные тона), никогда не в качестве декоративных элементов интерфейса. Компоненты без рамок: закругленные карточки с радиусом 28px, кнопки в форме таблеток, почти касающиеся краев страницы, без видимых контейнеров и без теней. Ритм создается за счет чередования белых и серых полос, а не разделителей или границ.
Разделы занимают всю ширину страницы и растягиваются от края до края с большим внутренним отступом (примерно 40–100 сторон). Максимальная ширина контента фактически центрирована внутри каждой полосы. Главный элемент представляет собой центрированный стек: метка в виде брови, увеличенный заголовок, одна кнопка призыва к действию, строка с ценой, а затем изображение продукта, заполняющее нижнюю часть области просмотра. Разделы следуют повторяющемуся шаблону: заголовок, выровненный по левому краю в полосе, затем либо двухколоночный макет с описанием товара (текст слева/изображение справа или чередующийся), трехколоночная сетка из карточек, либо центрированная визуальная витрина. Ритм контента полностью контролируется чередованием белого/трехцветного фона с вертикальными промежутками в 100–100 см — без разделителей, без карточек, переносящих элементы. Глобальная навигация представляет собой единую фиксированную панель. В разделах технических характеристик продукта используются полосы во всю ширину с большим внутренним пространством, где текст располагается в узких колонках (~560px) по центру на фоне более широкой визуальной области.
Визуальный язык Apple — это, прежде всего, фотография продукта: крупные планы аппаратного обеспечения на чисто белом или цветном фоне, без контекста образа жизни или постановочных сцен. На главном изображении показаны руки, держащие MacBook Neo пастельно-зеленого цвета — человеческий элемент здесь второстепенный, он демонстрирует масштаб и текстуру, а не эмоции. В разделах с вариантами продуктов два устройства представлены рядом на фоне соответствующих цветов отделки (розовый, зеленый, серебристый, небесно-голубой), каждая карточка представляет собой плоское цветное поле с продуктом по центру. Детальные снимки используют экстремальные крупные планы (шарнир ноутбука, модуль камеры) на нейтральном фоне. Здесь нет иллюстраций, нет абстрактной графики, нет декоративных изображений — продукт САМ является визуальным элементом. Иконография повсюду — монохромные линейные иконки в стиле SF Symbols толщиной 1,5–2px, взятые из набора системных иконок Apple. Фотосъемка всегда выполнена в высоком ключе: равномерное, бестеневое освещение, которое сводит продукт к графической форме, а не к объемному объекту.
Палитра
Бренд
- Electric Blue
#0071e3— Заполненные кнопки действий — единственный цветовой акцент в пользовательском интерфейсе, используемый экономно для призывов к действию. - Link Blue
#0066cc— Встроенные текстовые ссылки, ссылки со стрелками и шевронами. - Citrus Gradient
#3b3b23— Альтернативный вариант отделки, ставший визитной карточкой продукта — темная основа, плавно переходящая в желто-зеленые блики.
Нейтральные
- Primary Ink
#1d1d1f— Заголовки, основной текст, подписи к кнопкам — доминирующий тон переднего плана на всех поверхностях; фон главного изображения товара — плавно переходит от сплошного #1d1d1f вверху в хроматический синий. - Mid Gray
#707070— Вторичный текст, неактивное состояние навигации, приглушенные метки пользовательского интерфейса - Deep Gray
#474747— Навигационный текст и иконография выделены средним шрифтом. - Hairline
#d6d6d6— Тонкие границы между разделами и элементами пользовательского интерфейса. - Canvas
#f5f5f7— Чередование фонов разделов — серая полоса, которая разделяет белые участки. - Paper
#ffffff— Поверхность карточки, основной фон страницы, текст кнопки на темном фоне.
Типографика
от 12 до 96px · 10 ступеней
- SF Pro Display — замена: Inter · начертания 600, 700 · Заголовки-«герои» и подзаголовки для отображения — вес 700 при 80–96px с отрицательным межбуквенным интервалом до -1.44px создают фирменный стиль Apple «огромный заголовок, парящий в белом цвете». Заменители: Inter, system-ui
- SF Pro Display — замена: Inter · начертания 600 · Заголовки разделов, названия карточек, подзаголовки — шрифт 600 с немного положительным межбуквенным интервалом воспринимается как теплый и дружелюбный при средних размерах, в отличие от кратких заголовков выше.
- SF Pro Text — замена: Inter · начертания 400, 500, 600 · Основной текст, навигация, вспомогательные абзацы, небольшие подписи — шрифт с индексом 400 при 17px является основным. Отрицательное межбуквенное расстояние позволяет сделать основной текст более лаконичным на страницах с большим количеством информации.
Интервалы и форма
| Назначение | Значение |
|---|---|
| Плотность | плотная |
| Базовый шаг | 8-10px |
| Радиус кнопок | 980px |
| Радиус карточек | 28px |
| Тени | нет — границы вместо теней |
| Между секциями | 100-120px |
| Ширина страницы | 1200px |
ИИ соберёт ваш сайт в стиле Apple (España) и наполнит его
- Наполнит товарами и постами по ссылке — Instagram, TikTok, Facebook.
- Перенесёт контент со старого сайта — достаточно указать адрес.
- Современный дизайн на лучшем движке: React (Next.js) с серверным рендерингом и SEO-оптимизацией из коробки.
- Полная автоматическая SEO-оптимизация под поисковую выдачу и рекомендации нейросетей.
Похожие стили
- Airbnb — Тихая белая стена галереи с одной кораллово-красной закладкой
- Peak Design — Стена галереи, частично освещенная
- Ramp — Финансовый отдел редакции, черно-белые страницы с одним неоновым маркером. Практически монохромная поверхнос…
- 099 SUPPLY — Стена галереи, заполненная черно-белыми объектами
- Orderful — палуба управления промышленной логистикой — распечатанный контрольный лист диспетчера логистики, выполненный…
- Apple (España) — белая витрина галереи
- teenage engineering — Промышленный каталог в студийном освещении — продукт является единственным значимым объектом на странице, а …
- Apple (España) — Галерейная витрина в утреннем тумане
- Lightship — Кинематографическая диорама открытой дороги. Теплые кремовые стены галереи, украшенные крупными пейзажными ф…
- Custo — Галерея цвета оружейной стали с монолитным шрифтом. Выставочный зал в приглушенных серо-зеленых тонах, где е…
- Silencio — Белая комната с парящими артефактами. Галерейная витрина из теплой бумаги, где каждый элемент занимает свое …
- ORYZO AI — Фоторепортаж о фотолаборатории. Одинокий объект, парящий в теплой темноте, кремовый шрифт — единственное укр…