큐레이션 · 오픈 · 무료

Def Studio

어둡고 분위기 있는 제품 사진 위에 대규모 타이포그래피를 사용하는 디자인 스튜디오 포트폴리오.

01

디자인 DNA

대담한 타이포그래피와 고대비 비주얼을 통해 창작 작품을 소개하는 미니멀리스트 디지털 포트폴리오.

02

컬러

최대 가독성을 위해 순수 블랙 배경과 화이트/밝은 회색 텍스트를 사용하는 엄격한 고대비 단색 팔레트.

03

타이포그래피

humanist-sans

• display96px · 300
• heading25px · 300
• body16px · 400

표시 및 내비게이션 텍스트에 경량(300)을 사용하여 우아함을 유지합니다. · 텍스트 계층은 굵기 변화보다 극단적인 크기 차이를 통해 주로 확립됩니다. · 내비게이션 항목은 섹션 제목과 동일한 타이포그래피를 사용하지만 더 작은 축척으로 배치합니다.

04

여백

100px 30px 60px 30px와 같은 특정 padding 값을 통해 유도되는 넉넉하고 비대칭적인 간격.

05

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

최소한의 테두리를 사용하며, 주로 내비게이션 요소를 위한 텍스트 테두리.

06

레이아웃

풀너시 어두운 배경과 크고 좌측 정렬된 타이포그래피 오버레이.

07

모션과 인터랙션

top 및 opacity 속성에 광범위하게 0.5초 전환 적용. · 요소 가시성 변화를 위한 opacity 페이드 사용.

포인터 커서가 상호작용 요소를 나타내며, 미묘한 opacity 또는 색상 변화가 수반될 가능성이 높음. · 포트폴리오 섹션이나 외부 링크로 직접 내비게이션.

08

컴포넌트

• button 배경 채우기 없는 포인터 커서 텍스트 전용 버튼.
• card 하단에 텍스트 레이블이 있는 이미지 기반 포트폴리오 카드로, 테두리나 배경 컨테이너 없음.
• hero 거대한 좌측 정렬 텍스트 내비게이션이 포함된 풀스크린 어둡고 분위기 있는 이미지.

09

보이스와 금지 목록

• 톤 자신감 있고 미니멀하며 전문적.
• 헤드라인 소문자, 거대한 축척, 경량, sans-serif.
• CTA 내비게이션이나 인라인 텍스트에 통합된 단순한 텍스트 기반 링크.

• 둥근 모서리를 사용하지 마세요 — 스크린샷에서 모든 카드와 요소의 날카로운 모서리 확인
• 드롭 섀도우를 추가하지 마세요 — 스크린샷에서 완전히 평면적이고 테두리 없는 표면 확인
• 다중 컬럼 텍스트 레이아웃을 사용하지 마세요 — 스크린샷에서 좌측 정렬된 넓은 타이포그래피 확인
• 무거운 글꼴 굵기를 적용하지 마세요 — 스크린샷에서 주로 경량(300)과 레귤러(400) 굵기 확인
• 장식 패턴을 사용하지 마세요 — 스크린샷에서 단색과 사진 배경 확인
• 텍스트 중앙 정렬을 사용하지 마세요 — 스크린샷에서 내비게이션과 제목의 강한 좌측 정렬 확인
• 피하기: 과도한 장식 요소
• 피하기: 고채도 악센트 컬러
• 피하기: 밀도 높은 텍스트 블록

10

팩 안의 실제 스크린샷

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

11

System Prompt

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