순수한 흑백을 중심으로 한 완벽한 무채색 팔레트. 고품질 사진이 모든 시각적 관심과 브랜드 개성을 담당합니다.
03
타이포그래피
didone-serif · grotesque-sans
display56px · 400
heading12px · 400
body12px · 400
브랜드 로고 'KHAITE'는 대형 사이즈의 고대비 Didone 세리프(ITC Galliard)를 사용합니다. · 모든 탐색 및 UI 텍스트는 12px의 깔끔한 라이트 고트릭 산세리프(Fakt Pro)를 사용합니다. · 텍스트는 세련된 에디토리얼 분위기를 위해 자주 대문자로 표시되며, 넉넉한 자간이 적용됩니다. · 글꼴 두께는 350-400으로 엄격히 유지하며, 매우 드문 강조를 제외하고는 볼드체를 사용하지 않습니다.
04
여백
4px
8px
16px
24px
32px
48px
64px
96px
특히 사진 요소 주변에 넉넉한 여백과 호흡 공간을 두는, 4px 기본 그리드를 엄격히 따릅니다.
05
표면 (라운드 / 그림자 / 경계선)
sm · 0px
md · 0px
lg · 0px
pill · 999px
'지금 쇼핑하기'와 같은 대화형 텍스트 요소에만 미세한 밑줄을 위해 최소한으로 사용됩니다.
06
레이아웃
1280container
12columns
24pxgutter
768 / 1024breakpoints
풀블리드 히어로 이미지 뒤에 요소 간 넉넉한 여백을 둔 깔끔하고 중앙 정렬된 그리드 레이아웃이 이어집니다.
07
모션과 인터랙션
300msmicro
300mssmall
300msmedium
cubic-bezier(0.4, 0, 0.2, 1)easing
대화형 요소 상태에 대한 불투명도 전환 · hover 시 미세한 배경색 변화
텍스트 링크에서 미세한 불투명도 감소 또는 밑줄 표시 · hover 상태 이상의 시각적 피드백 없이 포인터 상호작용 수행
08
컴포넌트
button미세한 밑줄이나 테두리가 있는 미니멀한 텍스트 링크; 단색으로 채워진 버튼은 보이지 않습니다.
card이미지와 소형 대문자 텍스트 레이블을 사용한 깔끔하고 꾸밈없는 상품 프레젠테이션.
hero전체 뷰포트 사진 히어로 위에 오버레이된 세리프 헤드라인과 미세한 텍스트 링크 콜투액션.
09
보이스와 금지 목록
톤세련되고 절제되며 자신감 있는
헤드라인우아한 세리프 헤드라인, 가끔 이탤릭체로 표시되어 에디토리얼 권위를 전달합니다.
CTA강한 버튼 대신 얇은 밑줄을 사용한 미세한 텍스트 기반 콜투액션.
강하고 무거운 타이포그래피를 사용하지 마십시오 — 스크린샷은 전체적으로 라이트 글꼴 두께(350-400)를 보여줍니다
장식용 그림자나 글로우를 추가하지 마십시오 — 스크린샷은 완전히 플랫하고 깔끔한 표면을 보여줍니다
화려한 버튼이나 뱃지를 사용하지 마십시오 — 스크린샷은 밑줄이 있는 미세한 텍스트 링크만 보여줍니다
경쟁하는 여러 요소로 레이아웃을 복잡하게 하지 마십시오 — 스크린샷은 넉넉한 여백을 보여줍니다
컨테이너에 둥근 모서리를 사용하지 마십시오 — 스크린샷은 날카롭고 깔끔한 모서리를 보여줍니다
바쁜 패턴이나 그래디언트를 사용하지 마십시오 — 스크린샷은 단색 흰색 및 거의 흰색 배경을 보여줍니다
이것은 Khaite의 럭셔리 패션 전자상거래 사이트입니다. 포지셔닝은 프리미엄, 에디토리얼, 절제된 느낌입니다. 주요 색상은 악센트 컬러 없이 순수한 검정(#000000)과 흰색(#FFFFFF)입니다. 타이포그래피는 브랜드 로고와 헤드라인에 Didone 세리프(ITC Galliard)를, 모든 UI 텍스트에 12px의 라이트 고트릭 산세리프(Fakt Pro)를 사용합니다. 중요 제약 사항: 절대로 볼드체 두께를 사용하지 마십시오, 장식용 그림자를 절대 추가하지 마십시오, 화려한 버튼을 절대 사용하지 마십시오, 레이아웃을 절대 복잡하게 하지 마십시오, 컨테이너 모서리를 절대 둥글게 하지 마십시오, 바쁜 배경을 절대 사용하지 마십시오. 이 디자인은 최소한의 UI 간섭으로 고품질 사진을 우선시하여 높은 수준의 쇼핑 경험을 제공합니다.
이 감각을 당신의 에이전트에
이 디자인의 기계 판독 가능한 사양——색상·타이포·모션까지——을 그대로 AI 에이전트에 전달하세요.
