Apple Premium
순백 배경 위 대형 제품 사진과 SF Pro 시스템 타이포 — 여백과 정밀함으로 프리미엄을 말하는 제품 마케팅 스타일.
설명
애플 제품 마케팅 페이지의 정제된 프리미엄 룩. 순백(또는 순흑) 배경에 근-검정 텍스트, SF Pro 시스템 폰트, 크고 선명한 제품 사진, 넉넉한 수직 여백을 결합한다. 색은 극도로 절제하고 파란색 링크·CTA 액센트 하나만 허용한다. 알약(pill) 버튼과 매우 미세한 하드웨어급 디테일이 특징이며, 밝은 흰 섹션과 순검정 섹션을 교차해 리듬을 만든다. 장식보다 제품 사진과 공간이 무게를 진다.
타입 스케일
display Ag 스타일 견본 Style Specimen
h1 Ag 스타일 견본 Style Specimen
h2 Ag 스타일 견본 Style Specimen
h3 Ag 스타일 견본 Style Specimen
body Ag 스타일 견본 Style Specimen
caption Ag 스타일 견본 Style Specimen
SF Pro는 애플의 시스템 폰트(Text/Display 옵티컬 사이즈). 헤드라인은 600 semibold, 본문은 400에 약간 좁은 자간(-0.022em)이 특징. google_fonts_fallback의 Inter는 SF Pro 접근이 없을 때의 시스템 폰트 대체재(system-substitute)이며 그리드·자간 인상이 가장 근접하다. 굵기는 300/400/600/700 측정.
골든 예제 (exemplar)
Do
- 히어로는 중앙 정렬 헤드라인 + 한 줄 서브헤드 + CTA 쌍(채움 알약 + 텍스트/아웃라인 알약)으로 구성한다
- 색은 흑백 뉴트럴 + 파란색 하나로만 제한한다
- 제품 사진을 크고 선명하게, 넉넉한 여백과 함께 배치한다
- 밝은 흰 섹션과 순검정 섹션을 교차해 리듬을 만든다
- 본문 자간을 약간 좁혀(-0.02em) SF Pro 인상을 재현한다
Don't
- 파란색 외의 채도 높은 색이나 그라디언트 남발 금지
- 각진 사각 버튼 금지 — 버튼은 알약형
- 무거운 그림자·글래스 과용 금지(내비 블러 정도만)
- 빽빽한 텍스트·데이터 밀도 금지 — 공간이 프리미엄이다
- 장식용 아이콘·일러스트로 제품 사진의 자리를 빼앗지 말 것
컴포넌트 노트
- button
- base: 알약형(radius 980px). primary=파란색 채움 + 흰 글자, 폰트 17px/400, padding 8px 16px 정도secondary_variant: 투명 배경 + 파란 글자 + 파란 1px 테두리 알약(예: 'Shop iPhone')hover: 채움 버튼은 약간 밝은 블루로, 150msfocus: 파란 ring 아웃라인text_variant: 테두리 없는 파란 텍스트 링크 + 셰브런(‘Learn more ›’)
- card
- 라운드 18px, 그림자 거의 없음. 밝은 카드는 #f5f5f7 배경, 어두운 타일은 순검정 배경 + 흰 텍스트. 제품 사진이 중심.
- input
- radius 8px, 옅은 뉴트럴 보더, 포커스 시 파란 ring.
- nav
- 상단 반투명 바(블러) + 애플 로고·짧은 카테고리 링크·검색·장바구니 아이콘. 얇고 중앙 정렬된 글로벌 네비.