따뜻한 오프화이트 배경에 읽기 좋은 짙은 텍스트, 강조를 위해 생생한 블루와 퍼플 포인트를 사용합니다.
03
타이포그래피
transitional-serif · humanist-sans
display96px · 700
headline30px · 700
body18px · 400
caption14px · 400
디스플레이 및 헤드라인에는 에디토리얼 권위를 더해주는 전이형 세리프를 사용합니다. · 본문 텍스트에는 높은 가독성과 현대적 느낌을 보장하는 휴머니스틱 산세리프를 사용합니다. · 장식적이고 손으로 쓴 듯한 강조를 위해 스크립트 폰트(Qwitcher Gryphen 등)는 절제하여 사용합니다.
04
여백
4px
8px
16px
24px
32px
48px
64px
96px
4px 그리드를 기반으로 일관되고 리드미컬하여, 구조적이면서도 숨 쉬는 레이아웃을 만듭니다.
05
표면 (라운드 / 그림자 / 경계선)
sm · 2px
md · 6px
lg · 12px
pill · 999px
최소화하고 깔끔하게 사용하며, 주로 1px 라인으로 구조적 구분을 위한 것입니다.
없음 · 0 0 5px 0 rgba(128, 128, 128, 1)
06
레이아웃
1280container
12columns
24pxgutter
768 / 1024breakpoints
풍부한 여백과 명확한 섹션 헤더를 갖춘 깔끔한 중앙 정렬 기둥형 레이아웃.
07
모션과 인터랙션
220msmicro
400mssmall
800msmedium
cubic-bezier(0.4, 0, 0.2, 1)easing
모달 및 인터랙티브 요소를 위한 부드러운 불투명도와 변환 전환. · 링크와 버튼에 적용되는 미묘한 호버 효과.
인터랙티브 요소에 미묘한 색상 변화 또는 불투명도 변화. · 약간의 변환 또는 불투명도 변화로 즉각적인 시각적 피드백 제공.
08
컴포넌트
button깔끔한 타이포그래피와 최소한의 스타일링을 사용한 간단한 텍스트 기반 버튼.
card명확한 제목과 메타데이터를 갖춘 이미지 중심 카드. 얇은 선으로 분리되기도 합니다.
chip카테고리 라벨. 강조를 위해 때때로 색상이 입혀진 상단 테두리를 적용합니다.
input1px 테두리를 사용한 표준적이고 깔끔한 입력 필드.
hero프로모션용 모달 오버레이가 자주 포함되는, 이미지 중심의 큰 히어로 섹션.
09
보이스와 금지 목록
톤큐레이션된, 정교하며, 약간의 장난기가 있는 톤.
헤드라인대담하고 단정적인 문체. 권위를 위해 종종 세리프 폰트를 사용합니다.
CTA직접적이고 명확하며, 강조를 위해 모든 글자를 대문자로 표시합니다.
다크 모드를 사용하지 마세요. 이 사이트는 따뜻한 밝은 배경(#FAF8EF)만 사용합니다.
헤드라인에 산세리프를 사용하지 마세요. 이 사이트는 주로 디스플레이 텍스트에 전이형 세리프를 사용합니다.
강조색으로 생생한 녹색을 사용하지 마세요. 이 사이트는 생생한 블루(#2EA3F2)와 은은한 퍼플(#4C40E0)을 사용합니다.
무거운 드롭 그림자를 사용하지 마세요. 이 사이트는 최소화하거나 미묘한 그림자가 있는 깔끔하고 플랫한 표면을 선호합니다.
기사에 다단 텍스트 레이아웃을 사용하지 마세요. 이 사이트는 단일, 중앙 정렬, 읽기 좋은 기둥을 유지합니다.
카드에 둥근 모서리를 사용하지 마세요. 이 사이트는 날카롭거나 아주 약간 둥근 모서리(2-6px)를 사용합니다.
이 웹사이트는 라이프스타일, 패션, 문화에 초점을 맞춘 큐레이션된 에디토리얼 웹사이트로, 정교한 디지털 매거진으로 포지셔닝됩니다. 디자인 DNA는 따뜻한 오프화이트 배경(#FAF8EF)에 읽기 좋은 짙은 텍스트(#1A202C), 생생한 블루(#2EA3F2)와 퍼플(#4C40E0) 포인트를 중심으로 합니다. 타이포그래피는 대담한 헤드라인을 위한 전이형 세리프와 높은 가독성을 위한 휴머니스틱 산세리프를 쌍으로 구성합니다. 핵심 중요 주의사항: 다크 모드를 절대 사용하지 않으며, 디스플레이 헤드라인에 산세리프를 사용하지 않으며, 생생한 녹색 포인트 색상을 도입하지 않습니다. 레이아웃은 깔끔하고 중앙 정렬이며 여백이 풍부하며, 이미지 중심 카드와 최소 기능적 UI 컴포넌트를 특징으로 합니다.
이 감각을 당신의 에이전트에
이 디자인의 기계 판독 가능한 사양——색상·타이포·모션까지——을 그대로 AI 에이전트에 전달하세요.
