큐레이션 · 오픈 · 무료

Xn Smon Vpa

대담한 타이포그래피와 부드러운 색상 악센트를 통해 computationally design을 강조하는 미니멀 스튜디오 포트폴리오입니다.

01

디자인 DNA

깨끗한 흰색 갤러리 벽에 전시된 디지털 아티팩트의 큐레이션된 전시회.

02

컬러

흰색 배경 위의 고대비 흑색에, 부드러운 파스텔과 차분한 웜톤 악센트가 더해져 있습니다.

03

타이포그래피

humanist-sans

• display172px · 400
• heading66px · 400
• body31px · 400

모든 주요 디스플레이 및 본문 텍스트에 Tex Gyre Heros를 사용합니다. · 세리프 서체는 브랜드 마크에만 사용합니다. · 큰 디스플레이 사이즈에는 좁은 자간(negative letter-spacing)을 유지합니다.

04

여백

일관된 4px 기본 스케일과 섹션 간 넉넉한 여백을 사용합니다.

05

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

목록 항목을 구분하기 위해 2px 상단 테두리만 미니멀하게 사용합니다.

06

레이아웃

포트폴리오 목록의 행을 구분하는 뚜렷한 상단 테두리가 있는 전체 폭 섹션입니다.

07

모션과 인터랙션

인터랙티브 요소의 부드러운 0.2초 색상 전환 · 클릭 시 미세한 0.1초 변형 이동 · 콘텐츠 확장을 위한 0.5초 높이 애니메이션

텍스트 요소에 0.2초 동안 적용되는 색상 전환 효과입니다. · 미세한 0.1초 변형 스케일 효과입니다.

08

컴포넌트

• button 전체 모서리 반경(999px radius)의 큰 알약 모양(pill-shaped) 인터랙티브 영역으로, 주요 카테고리 토글로 사용됩니다.
• card 인덱스, 제목, 연도 열을 포함하는 상단 테두리가 있는 단순한 목록 항목입니다.
• hero 매우 큰 텍스트를 담은 스택된 알약 모양 요소가 특징인 거대한 타이포그래피 히어로 섹션입니다.

09

보이스와 금지 목록

• 톤 세련되고, 미니멀하며, 전문적인 어조입니다.
• 헤드라인 대담하고, 자간이 좁으며, 소문자 또는 타이틀 케이스, 극도로 큰 규모의 스타일입니다.
• CTA 전통적인 버튼 스타일보다는 큰 인터랙티브 영역에 의존하는 최소한의 텍스트 스타일입니다.

• 거친 테두리를 사용하지 마세요 — 스크린샷에는 미니멀한 2px 상단 테두리만 표시됩니다.
• 드롭 그림자를 사용하지 마세요 — 스크린샷에는 완전히 평면적인 서피스가 표시됩니다.
• 작은 버튼 크기를 사용하지 마세요 — 스크린샷에는 거대한 전체 폭 알약 모양이 표시됩니다.
• 가운데 정렬된 네비게이션을 사용하지 마세요 — 스크린샷에는 왼쪽 정렬된 사이트 이름과 오른쪽 정렬된 링크가 표시됩니다.
• 복잡한 그리드를 사용하지 마세요 — 스크린샷에는 엄격한 단일 칼럼 리니어 목록이 표시됩니다.
• 굵은 글꼴 두께를 사용하지 마세요 — 스크린샷에는 일관된 400 두께의 타이포그래피가 표시됩니다.
• 피하기: 복잡한 레이아웃
• 피하기: 무거운 그림자
• 피하기: 화려한 네온색
• 피하기: 장식적 아이콘

10

팩 안의 실제 스크린샷

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

11

System Prompt

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