큐레이션 · 오픈 · 무료

Kaleidografik

독립 크리에이티브 스튜디오를 위한 미니멀하고 콘텐츠 중심의 포트폴리오.

01

디자인 DNA

대담한 클라이언트 작업이 스스로 말하게 두는 빈 캔버스

02

컬러

따뜻한 오프화이트 배경의 엄격한 모노크롬 캔버스. 색상은 클라이언트 작업에 전적으로 의존합니다.

03

타이포그래피

humanist-sans · monospace

• display120px · 400
• h132px · 400
• body16px · 400

모든 타이포그래피는 웨이트 400의 Suisse Intl Regular 사용 · 내비게이션 링크는 바디 사이즈 16px 사용, 활성 상태에는 밑줄 적용 · 거대한 배경 워터마크 텍스트는 극도로 큰 디스플레이 사이즈 사용

04

여백

컨테이너에 20px 수평 패딩과 75px 하단 패딩을 둔 풍부한 여백

05

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

컨테이너에 보이는 테두리 없음, 활성 내비게이션 항목에 1px solid 블랙 밑줄

프로젝트 카드에 0 4px 20px rgba(0,0,0,0.1)

06

레이아웃

다양한 카드 크기의 메이슨리 스타일 그리드, 상단 내비게이션 바, 그리고 큰 배경 워터마크 텍스트

07

모션과 인터랙션

hover 상태에서의 불투명도 페이드 트랜지션 · 내비게이션을 위한 부드러운 불투명도 및 transform 트랜지션 · 대화형 요소에서의 배경색 트랜지션

내비게이션 링크 및 프로젝트 카드의 불투명도 감소 · 프로젝트 상세 페이지로 이동

08

컴포넌트

• button 보이는 버튼 컨테이너 없이 밑줄 상태를 가진 미니멀 텍스트 링크
• card 스크린샷과 케이스 스터디 이미지를 포함한 다양한 종횡비의 프로젝트 미리보기 카드
• chip 프로젝트 메타데이터용 1px 블랙 테두리의 작은 필 모양 태그
• input 현재 뷰에서는 보이지 않음
• hero 크고 페이드된 배경 타이포그래피 위에 흩어진 프로젝트 카드

09

보이스와 금지 목록

• 톤 절제되고 전문적이며, 작업이 스스로 말하게 둠
• 헤드라인 미니멀하고 직접적이며, 프로젝트 카테고리에는 대문자 사용
• CTA 시각적 강조 없이 간단한 텍스트 링크

• 여러 폰트 웨이트 사용 금지 — 스크린샷에서는 전체적으로 웨이트 400이 균일하게 사용됨
• 장식적 UI 요소 추가 금지 — 스크린샷에서는 순전히 콘텐츠 중심의 레이아웃을 보여줌
• 다채로운 배경 사용 금지 — 스크린샷에서는 일관된 #ECEAE5 오프화이트를 보여줌
• 복잡한 버튼 스타일 생성 금지 — 스크린샷에서는 밑줄이 있는 텍스트 전용 내비게이션을 보여줌
• 메인 컨테이너에 드롭 쉐도우 추가 금지 — 스크린샷에서는 플랫하고 깔끔한 카드 프레젠테이션을 보여줌
• 브랜드 컬러 액센트 사용 금지 — 스크린샷에서는 완전히 모노크롬 체계를 보여줌
• 피하기: 클라이언트 작업과 경쟁하는 장식 요소 피하기
• 피하기: 복잡한 그라디언트 또는 그림자 피하기
• 피하기: 여러 폰트 웨이트 피하기

10

팩 안의 실제 스크린샷

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

11

System Prompt

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