큐레이션 · 오픈 · 무료

Petertarka

미니멀한 편집 타이포그래피로 상세한 3D 환경을 선보이는 하이엔드 크리에이티브 포트폴리오.

01

디자인 DNA

클린하고 스위스에서 영감을 받은 타이포그래피 레이아웃으로 선보이는 맞춤 제작된 3D 비주얼 월드의 큐레이션된 갤러리입니다.

02

컬러

중성 오프화이트 캔버스와 강렬한 블랙 타이포그래피 사이의 고대비.

03

타이포그래피

geometric-sans

• display38px · 300
• body16px · 400

모든 텍스트 계층에 기하학적 sans-serif 사용 · 큰 디스플레이 텍스트에는 가벼운 웨이트(300) · 본문 및 작은 요소에는 일반 웨이트(400) · 큰 디스플레이 텍스트에는 타이트한 line-height

04

여백

여유로운 패딩(45px)으로 갤러리 같은 공간감을 연출합니다.

05

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

얇은 1px rgba(0, 0, 0, 0.1) 선을 절제하여 사용하며, 때로는 비대칭적(0px 1px 1px 0px)으로 배치합니다.

06

레이아웃

단색 블록과 여백을 교차 배치하는 깔끔한 그리드.

07

모션과 인터랙션

hover 시 색상 및 불투명도 전환 · 미세한 UI 피드백을 위한 빠른(0.125s) 불투명도 전환

미세한 불투명도 변화와 색상 전환. · 표준 링크 동작.

08

컴포넌트

• button 보이는 버튼 컨테이너 없이 미니멀한 텍스트 링크만 사용.
• card 보이는 카드 컴포넌트 없이 배경 위에 콘텐츠를 직접 표시.
• hero 넓게 펼쳐진 배경 색상에 큰 3D 아이소메트릭 일러스트레이션과 간결한 타이포그래피.

09

보이스와 금지 목록

• 톤 미니멀하고 자신감 있는 전문적 어조.
• 헤드라인 직관적이고 간결한 고객사 이름.
• CTA 절제된 텍스트 링크.

• 세리프 폰트를 사용하지 마세요 — 스크린샷은 엄격한 기하학적 sans-serif 시스템을 보여줍니다.
• 둥근 모서리를 사용하지 마세요 — 스크린샷은 날카롭고 0px border-radius 요소를 보여줍니다.
• 복잡한 그림자를 사용하지 마세요 — 스크린샷은 완전히 평면적인 표면 표현을 보여줍니다.
• 밀도 높은 텍스트 블록을 사용하지 마세요 — 스크린샷은 드문드문 배치된 큰 형식의 타이포그래피를 보여줍니다.
• 고채도 UI 컬러를 사용하지 마세요 — 스크린샷은 분리된 색상 블록이 있는 중성 팔레트를 보여줍니다.
• 장식적인 테두리를 사용하지 마세요 — 스크린샷은 최소한의 1px 구분선만 사용합니다.
• 피하기: 과도한 장식
• 피하기: 지나치게 크고 강한 행동 유도 문구
• 피하기: 복잡한 레이아웃

10

팩 안의 실제 스크린샷

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

11

System Prompt

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