큐레이션 · 오픈 · 무료

Hartzlerdairy

대담한 서체, 큰 제품 사진, 청록과 다크 그린 포인트가 있는 깔끔한 화이트 미학의 프리미엄 수제 유제품 브랜드 웹사이트입니다.

01

디자인 DNA

대담하고 자신감 넘치는 서체와 고품질 사진으로 제품을 소개하는 프리미엄 로컬 유제품 브랜드.

02

컬러

화이트 스페이스와 제품 사진을 주요 시각적 앵커로 사용하는 미니멀한 컬러 팔레트입니다.

03

타이포그래피

geometric-sans · humanist-sans

• display333px · 900
• display-md290px · 900
• body14px · 400

제품 라벨과 내비게이션에는 대문자 사용 · 큰 디스플레이 서체에는 타이트한 자간 유지 · 브랜드 요소와 포인트에는 다크 그린 사용

04

여백

제품이 숨 쉴 수 있는 넉넉한 간격

05

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

메인 카드에는 보더 없음

0 4px 20px rgba(0, 0, 0, 0.1)

06

레이아웃

겹쳐지는 제품 사진과 큰 배경 텍스트가 있는 전체 폭 히어로

07

모션과 인터랙션

인터랙티브 요소에 섬세한 hover 전환 · 제품 공개를 위한 스크롤 트리거 애니메이션

인터랙티브 요소에 섬세한 색상 변화 또는 스케일 변화 · 시각적 피드백이 있는 즉각적인 반응

08

컴포넌트

• button 둥근 모서리와 대문자 텍스트가 있는 큰 청록 태그
• card 화이트 배경에 섬세한 드롭 섀도우가 있는 제품 사진
• chip 스크립트 로고가 있는 원형 'FEATURED' 뱃지
• hero 거대한 배경 서체가 있는 전체 뷰포트 제품 쇼케이스

09

보이스와 금지 목록

• 톤 자신감 있고 프리미엄하며 수제적인 느낌
• 헤드라인 대담하고 대문자이며 대규모의 서체
• CTA 둥근 모서리와 깔끔한 산세리프 텍스트가 있는 청록 태그

• 얇거나 가벼운 서체 사용 금지 — 스크린샷에서 모든 곳에 대담하고 무거운 웨이트가 사용됨
• 작은 히어로 텍스트 사용 금지 — 스크린샷에서 거대한 333px 디스플레이 타입이 사용됨
• 다크 배경 사용 금지 — 스크린샷에서 주로 화이트 배경 사용
• 여러 포인트 컬러 사용 금지 — 스크린샷에서 일관된 청록과 다크 그린 사용
• 제품 사진 숨기기 금지 — 스크린샷에서 제품이 중앙 초점이 됨
• 장식 요소 사용 금지 — 스크린샷에서 깔끔하고 미니멀한 디자인
• 피하기: 지저분한 레이아웃 피하기
• 피하기: 지나치게 장난스럽거나 캐주얼한 서체 피하기
• 피하기: 복잡한 컬러 스킴 피하기

10

팩 안의 실제 스크린샷

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

11

System Prompt

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