큐레이션 · 오픈 · 무료

Veja

사진 중심, 미니멀 에디토리얼 디자인 시스템을 활용하는 프리미엄 지속가능한 신발 브랜드.

01

디자인 DNA

미니멀 이커머스와 하이엔드 에디토리얼 스토리텔링을 결합한 프리미엄 패션 브랜드.

02

컬러

고대비 흑백의 모노크롬 팔레트를 사용하며, 시각적 풍요로움은 사진에 의존합니다.

03

타이포그래피

grotesque-sans

• display60px · 700
• body16px · 400

내비게이션과 주요 호출문 텍스트는 대문자를 사용합니다. · Helvetica과 sans-serif 대체 폰트를 사용하여 엄격한 타이포그래피 계층을 유지합니다. · 큰 디스플레이 텍스트는 라인 높이를 좁게, 본문 텍스트는 표준 간격으로 설정합니다.

04

여백

일관된 4px 그리드를 사용하며, 인터랙티브 요소와 모달 레이아웃에는 여유로운 패딩을 둡니다.

05

표면 (라운드 / 그림자 / 경계선)

버튼과 인터랙티브 상태에 1px solid 테두리를 사용합니다.

0px 0px 18px 0px rgba(0, 0, 0, 0.2)

06

레이아웃

중앙 모달과 하단 쿠키 배너 뒤에 숨겨진 표준 이커머스 그리드를 사용한 사진 중심 레이아웃입니다.

07

모션과 인터랙션

hover 상태 및 모달 표시를 위한 opacity 및 transform 전환.

인터랙티브 요소에 대한 미묘한 opacity 또는 transform 전환. · 전환 피드백을 포함한 표준 포인터 커서.

08

컴포넌트

• button 최소한의 border-radius과 대문자 텍스트를 사용한 직사각형 버튼입니다.
• card 보이지 않는 테두리가 있는 제품 또는 에디토리얼 이미지 그리드입니다.
• chip 해당 없음
• input 해당 없음
• hero 주요 hero 요소로 사용되는 풀블리드 시네마틱 사진입니다.

09

보이스와 금지 목록

• 톤 조용히 자신감 있는, 프리미엄하고 투명한 톤.
• 헤드라인 대담하고, 대문자이며, 선언적인 스타일.
• CTA 명확성을 위해 모든 글자가 대문자인 직접적이고 기능적인 스타일.

• 밝은 강조색을 사용하지 마세요 — 스크린샷은 검정, 흰색, 회색의 엄격한 모노크롬 팔레트를 보여줍니다.
• 둥근 필 버튼을 사용하지 마세요 — 스크린샷은 5px 이하의 작은 border-radius을 가진 직사각형 버튼을 보여줍니다.
• 장난스럽거나 손글씨 또는 세리프 타이포그래피를 사용하지 마세요 — 스크린샷은 엄격한 Helvetica/grotesque-sans 사용을 보여줍니다.
• 여러 겹친 텍스트 요소로 레이아웃을 복잡하게 하지 마세요 — 스크린샷은 큰 사진 영역 위에 최소한의 텍스트를 보여줍니다.
• 복잡한 내비게이션 뒤에 브랜드 아이덴티티를 숨기지 마세요 — 스크린샷은 지속적이고 명확한 로고 배치를 보여줍니다.
• 가볍고 공기 같은 파스텔 배경을 사용하지 마세요 — 스크린샷은 고대비를 위해 진한 검정과 선명한 흰색을 보여줍니다.
• 피하기: 밝은 강조색의 과도한 사용
• 피하기: 둥글고 장난스러운 UI 요소
• 피하기: 밀집하고 복잡한 타이포그래피

10

팩 안의 실제 스크린샷

실제 페이지에서 캡처 · 실 computed styles

11

System Prompt

en · zh-CN · zh-TW · ja · ko