큐레이션 · 오픈 · 무료

Mybrentano Ch

자연적인 통합 건강 관리 제품을 위한 깔끔하고 편집적인 전자상거래 사이트.

01

디자인 DNA

깔끔한 미학과 유기적 따스함을 결합한 현대적, 디지털 네이티브 약방.

02

컬러

따뜻한 베이지와 잉크 톤을 사용한 고대비 자연 팔레트.

03

타이포그래피

monospaced-sans · sans-serif

• display60px · 400
• h130px · 400
• body18px · 400
• small15px · 400

모든 타이포그래피는 깔끔한 기하학적 sans-serif 계열을 사용합니다. · 헤드라인은 기술적 정확성을 위해 monospaced 변형을 활용합니다. · 글꼴 두께는 모든 텍스트에서 일관되게 regular(400)를 유지합니다.

04

여백

기본 단위 4px를 표준으로 사용한 넉넉한 여백.

05

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

구조와 구분을 위해 1px solid 검정 테두리를 사용합니다.

06

레이아웃

상단 탐색 바와 콘텐츠를 위한 세로 스택 흐름을 갖춘 그리드 기반.

07

모션과 인터랙션

호버 상태에서의 부드러운 transform 전환 · 페이지 전환 시 부드러운 easing

인터랙티브 요소에서 절제된 불투명도 또는 색상 변화. · 모든 클릭 가능 영역에 표준 포인터 커서.

08

컴포넌트

• button 알약 형태의 언어 전환 버튼과 원형 아이콘 버튼을 포함한 미니멀 윤곽선 버튼.
• card 얇은 테두리, 왼쪽 정렬 텍스트, 배경색 없는 깔끔한 제품 카드.
• chip 알약 형태 내부의 단순한 텍스트 기반 언어 전환.
• input 눈에 보이는 배경 없는 하단 테두리 입력 필드.
• hero 유기적이고 겹쳐지는 사진 콜라주를 배치한 크고 왼쪽 정렬된 monospaced 헤드라인.

09

보이스와 금지 목록

• 톤 전문적이면서도 친근하고 정보에 입각한.
• 헤드라인 monospaced 폰트로 인해 직접적이고 명확하며 약간 기술적인.
• CTA 간단하고 직접적이며, 'Kaufen'(구매)과 같은 단어로 구성됩니다.

• 드롭 섀도우 사용 금지 — 스크린샷은 평면적이고 테두리 중심의 디자인을 보여줍니다.
• 그라데이션 배경 사용 금지 — 스크린샷은 단색 따뜻한 베이지 배경을 보여줍니다.
• 컨테이너에 둥근 모서리 사용 금지 — 스크린샷은 날카롭고 사각적인 모서리를 보여줍니다.
• 강조를 위해 굵은 글꼴 두께 사용 금지 — 스크린샷은 일관되게 regular 두께를 보여줍니다.
• 밝고 고채도 액센트 색상 사용 금지 — 스크린샷은 절제된 검정-베이지 팔레트를 보여줍니다.
• 메인 콘텐츠에 중앙 정렬 레이아웃 사용 금지 — 스크린샷은 강한 왼쪽 정렬 그리드를 보여줍니다.
• 피하기: 화려하고 눈에 띄는 애니메이션
• 피하기: 복잡한 인터페이스
• 피하기: 지나치게 캐주얼한 언어

10

팩 안의 실제 스크린샷

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

11

System Prompt

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