큐레이션 · 오픈 · 무료

Knickey

포용적 속옷을 위한 사진 중심의 세련된 전자상거래 인터페이스.

01

디자인 DNA

제품 사진이 숨 쉴 수 있게 하는 조용하고 큐레이션된 카탈로그.

02

컬러

어스 톤 중성색과 부드러운 그린이 차분하고 유기적인 팔레트를 만듭니다.

03

타이포그래피

didone-serif · humanist-sans

• display64px · 400
• headline32px · 400
• body17px · 400
• caption14px · 400

히어로 넘버와 큰 강조는 didone-serif를 사용합니다. · 모든 인터랙티브 요소와 본문 텍스트는 humanist-sans를 사용합니다. · sans-serif 요소에 일관된 넓은 자간을 유지합니다.

04

여백

4와 8의 일관된 padding 배수로 숨 쉬는 레이아웃을 만듭니다.

05

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

체크박스 입력 외에는 보이는 테두리가 없습니다. 모달은 여백과 배경 대비에 의존합니다.

06

레이아웃

중앙 정렬 텍스트 칼럼을 양쪽으로 감싸는 풀블리드 사진이 있는 분할 레이아웃.

07

모션과 인터랙션

모달 오버레이의 페이드 및 스케일 입장 효과. · 인터랙티브 요소의 미세한 transform 전환.

버튼의 미세한 배경색 전환. · 오른쪽 상단의 작은 'X' 아이콘으로 모달 닫기.

08

컴포넌트

• button 테두리 반경 없는 대문자 화이트 텍스트의 솔리드 다크 사각형 버튼.
• card 컨테이너 대신 사진에 의존하는 이미지 중심의 테두리 없는 카드.
• chip 보이는 것이 없습니다.
• input 둥근 모서리와 부드러운 그레이 테두리의 커스텀 체크박스.
• hero 사진과 중앙 정렬 텍스트의 분할 구성을 특징으로 하는 전체 화면 또는 큰 모달 오버레이.

09

보이스와 금지 목록

• 톤 자신감 있고 차분하며 환영하는 어조.
• 헤드라인 짧고 직접적이며 가치 중심적인 (예: '15% 할인 받으세요').
• CTA 명확하고 대문자화된 행동 지향적 문구 (예: 'CLAIM 15% OFF').

• 무거운 드롭 섀도우 사용 금지 — 스크린샷은 대신 플랫하고 테두리 없는 표면을 보여줍니다.
• 밝고 채도 높은 악센트 사용 금지 — 스크린샷은 대신 차분한 그린과 다크 틸을 보여줍니다.
• 디스플레이용으로 장난스럽거나 둥근 sans-serif 폰트 사용 금지 — 스크린샷은 대신 날카로운 didone-serif를 보여줍니다.
• 긴 단락 중앙 정렬 금지 — 스크린샷은 텍스트 칼럼을 좁고 중앙 정렬하여 짧은 카피만 유지합니다.
• 콘텐츠 카드에 불필요한 테두리 추가 금지 — 스크린샷은 대신 테두리 없는 이미지를 보여줍니다.
• 다크 모드 또는 고대비 테마 사용 금지 — 스크린샷은 대신 밝고 크리미한 오프화이트 배경을 보여줍니다.
• 피하기: 공격적이거나 긴박한 언어
• 피하기: 지나치게 캐주얼하거나 은어적인 표현
• 피하기: 시각적 혼란이나 소음이 많은 배경

10

팩 안의 실제 스크린샷

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

11

System Prompt

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