모든 디스플레이 텍스트에 트랜지셔널 세리프를 사용합니다. · 보조 레이블에는 와이드 트래킹의 대문자를 사용합니다. · 포인트와 로고에는 따뜻한 골드 색상을 사용합니다.
04
여백
4px
8px
16px
24px
32px
48px
64px
96px
사진이 숨을 쉴 수 있도록 넉넉한 여백을 둡니다.
05
표면 (라운드 / 그림자 / 경계선)
sm · 0px
md · 0px
lg · 0px
pill · 999px
BOOK 버튼과 같은 내비게이션 요소에는 얇은 흰색 라인을 사용합니다.
06
레이아웃
1440container
12columns
24pxgutter
768 / 1024breakpoints
중앙 정렬된 텍스트와 미니멀한 내비게이션 오버레이가 있는 풀 뷰포트 히어로.
07
모션과 인터랙션
220msmicro
400mssmall
800msmedium
cubic-bezier(0.4, 0, 0.2, 1)easing
미세한 스크롤 다운 인디케이터. · 히어로 이미지에 대한 잠재적인 패럴랙스 또는 슬로우 줌.
인터랙티브 요소에 대한 미세한 불투명도 변화. · BOOK 버튼의 즉각적인 반응.
08
컴포넌트
button미니멀한 아웃라인 사각형에 대문자 텍스트.
card보이지 않음; 메인 표면으로 풀블리드 이미지에 의존합니다.
chip텍스트 오버레이(계절 정보)가 있는 원형 플로팅 요소.
hero중앙 정렬된 타이포그래피가 있는 풀블리드 포토그래피 배경.
09
보이스와 금지 목록
톤세련되고, 차분하며, 초대적인.
헤드라인경험에 초점을 맞춘, 호소력 있고 시적인.
CTA직설적이고 행동 지향적인.
밝고 네온 색상을 사용하지 마세요 — 팔레트는 차분하고 흙빛입니다.
메인 헤드라인에 산세리프를 사용하지 마세요 — 사이트는 트랜지셔널 세리프를 사용합니다.
히어로에 여러 CTA나 텍스트 블록으로 복잡하게 만들지 마세요 — 미니멀하고 집중적입니다.
주요 컨테이너에 둥근 모서리를 사용하지 마세요 — 디자인은 날카롭고 건축적인 직선을 선호합니다.
무거운 드롭 섀도우를 사용하지 마세요 — 표면은 평면으로 보이며 배경과 통합됩니다.
복잡하거나 패턴화된 배경을 사용하지 마세요 — 디자인은 고품질 사진에 의존합니다.
피하기: 크고 대비가 강한 색상 조합.
피하기: 여러 경쟁 요소가 있는 복잡한 레이아웃.
피하기: 캐주얼하거나 지나치게 장난스러운 언어.
11
System Prompt
고요한 포토그래피 중심의 럭셔리 산악 샬레 웹사이트입니다. 팔레트는 배경 이미지(#2D3336)의 어두운 흙빛 톤과 깨끗한 흰색 텍스트(#FFFFFF)가 지배하며, 브랜딩을 위해 따뜻한 골드(#C7B98D)를 포인트로 사용합니다. 타이포그래피는 디스플레이용 트랜지셔널 세리프와 본문용 깨끗한 산세리프를 사용하며, 레이블에는 와이드 트래킹 대문자를 사용합니다. 레이이아웃은 미니멀, 풀블리드, 에디토리얼 스타일입니다. 핵심 금지 사항: 네온 색상을 절대 사용하지 말 것, 헤드라인에 산세리프 사용을 피할 것, 사진이 말할 수 있도록 인터페이스를 복잡하지 않게 유지할 것. 전반적인 분위기는 차분하고 세련되며 프리미엄입니다.
이 감각을 당신의 에이전트에
이 디자인의 기계 판독 가능한 사양——색상·타이포·모션까지——을 그대로 AI 에이전트에 전달하세요.
