디스플레이는 클린한 sans-serif 본문 텍스트와 대비를 주기 위해 세리프를 사용합니다. · 내비게이션과 보조 텍스트는 깔끔하고 리듬감 있는 베이스라인 유지를 위해 대문자에 넓은 자간을 적용합니다. · 본문 텍스트는 여백을 최대화하기 위해 작고 눈에 띄지 않게 유지됩니다.
04
여백
4px
8px
16px
24px
32px
48px
64px
96px
프리미엄스럽고 깔끔한 느낌을 유지하기 위한 컨테이너 내 넉넉한 padding.
05
표면 (라운드 / 그림자 / 경계선)
sm · 4px
md · 8px
lg · 10px
pill · 999px
최소화되어, 일반적으로 어두운 잉크나 은은한 회색의 단순한 1px 라인으로 정의됩니다.
06
레이아웃
1280container
12columns
24pxgutter
768 / 1024breakpoints
비대칭 분할 레이아웃과 전체 너비의 분위기 있는 사진.
07
모션과 인터랙션
220msmicro
400mssmall
800msmedium
cubic-bezier(0.4, 0, 0.2, 1)easing
고요한 브라우징 경험을 위한 부드러운 페이드인과 gentle easing.
미세한 불투명도 변화 또는 색상 전환. · 상태 변화를 통한 즉각적인 시각적 피드백.
08
컴포넌트
button대문자 텍스트와 모서리가 딱딱한 고대비 단색 직사각형.
card최소한의 테두리와 깔끔한 타이포그래피를 갖춘 이미지 중심 카드.
chip단순한 알약 형태 또는 직사각형 태그.
input하단선만 있는 미니멀 입력 필드.
hero전체 뷰포트 또는 큰 사진 배경 위에 세리프 헤드라인이 겹쳐진 형태.
09
보이스와 금지 목록
톤세련되고, 고요하며, 분위기 있는.
헤드라인전환 세리프를 사용한 짧고 분위기 있는 구절.
CTA직설적이고, 대문자이며, 기능적인.
화려하거나 채도가 높은 색상을 사용하지 마세요 — 스크린샷은 엄격히 따뜻하고 채도가 낮은 뉴트럴 팔레트를 보여줍니다.
장식적이거나 무거운 폰트를 사용하지 마세요 — 스크린샷은 본문에 클린한 grotesque-sans와 디스플레이에 세련된 transitional-serif를 보여줍니다.
그림자나 무거운 테두리를 추가하지 마세요 — 스크린샷은 여백에 의존하는 플랫하고 테두리 없는 표면을 보여줍니다.
둥근 버튼이나 카드를 사용하지 마세요 — 스크린샷은 날카로운 직사각형 모서리(심지어 10px radius도 절제적으로 사용됨)를 보여줍니다.
좁고 밀집된 레이아웃을 사용하지 마세요 — 스크린샷은 넉넉한 padding과 요소 사이의 넓은 간격을 보여줍니다.
공격적이거나 판매적인 어조를 사용하지 마세요 — 스크린샷은 라이프스타일에 초점을 맞춘 고요하고 세련된 언어를 보여줍니다.
이 디자인 DNA는 차분하고 미니멀하며 포토그래픽적 접근 방식을 가진 프리미엄 향수 브랜드를 위한 것입니다. 따뜻한 뉴트럴 팔레트(#F6F3F0, #3C3C3C, #939393)와 transitional-serif 디스플레이 폰트와 grotesque-sans 본문 폰트를 페어링한 깔끔한 타이포그래피 계층을 사용합니다. 레이아웃은 넉넉한 여백과 고품질 라이프스타일 이미지에 의존합니다. 중요한 주의사항: 화려한 색상 피하기, 무거운 그림자 또는 테두리 피하기, 장식적 폰트 피하기, 둥근 UI 요소 피하기, 밀집된 텍스트 피하기, 공격적이거나 판매적인 언어 피하기. 이 스타일은 분위기가 중요한 프리미엄 소비재 브랜드, 에디토리얼 사이트 또는 하이엔드 제품 쇼케이스에 적합합니다.
이 감각을 당신의 에이전트에
이 디자인의 기계 판독 가능한 사양——색상·타이포·모션까지——을 그대로 AI 에이전트에 전달하세요.
