큐레이션 · 오픈 · 무료

Tofucollective

Sinophone 현대 미술을 위한 절제된, 타이포그래피 중심의 에디토리얼 플랫폼입니다.

01

디자인 DNA

에디토리얼적 절제가 느껴지는 미니멀 갤러리 카탈로그

02

컬러

엄격한 이진 팔레트를 사용한 고대비 흑백 디자인입니다.

03

타이포그래피

humanist-sans · system-ui-sans

• display90px · 400
• body16px · 400
• caption12px · 400

디스플레이 헤드라인에는 타이트한 leading을 사용합니다. · 모든 텍스트 요소에 높은 대비를 유지합니다. · 텍스트를 엄격한 좌측 마진에 정렬합니다.

04

여백

넓은 여백을 활용한 엄격한 8px 그리드입니다.

05

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

내비게이션 요소를 구분하는 단단한 1px 실선

06

레이아웃

묵직한 타이포그래피 좌측 열과 우측의 풀 하이팅 이미지로 구성된 비대칭 2열 그리드

07

모션과 인터랙션

UI 요소를 위한 매끄러운 transform 전환

인터랙티브 요소에 대한 섬세한 transform 이동 · 포인터 커서를 통한 즉각적인 피드백

08

컴포넌트

• button 세로 테두리로 분리된 텍스트 전용 내비게이션 링크
• card 시각적 카드 없음; 콘텐츠는 순수 타이포그래피 블록과 이미지로 제시
• hero 좌측에 거대한 타이포그래피 타이틀, 우측에 사진 이미지가 있는 풀 하이팅 분할 화면

09

보이스와 금지 목록

• 톤 학술적이고, 세련되며, 약간 시적인 어조
• 헤드라인 타이트한 leading을 사용한 거대한 소문자 또는 혼합 대소문자 디스플레이 타입
• CTA 시각적 버튼 없이 텍스트 기반의 미니멀리스틱 내비게이션

• 둥근 모서리를 사용하지 마세요 — 스크린샷에 내비게이션 라인이 완벽한 직각 모서리를 보여줍니다.
• 드롭 섀도우를 사용하지 마세요 — 스크린샷에 깊이감 없는 평면적 표면을 보여줍니다.
• 화려한 액센트 버튼을 사용하지 마세요 — 스크린샷에 라인으로 분리된 텍스트 전용 내비게이션을 보여줍니다.
• 장식용 세리프 서체를 사용하지 마세요 — 스크린샷에 깔끔한 산세리프 타이포그래피를 보여줍니다.
• 히어로 텍스트를 중앙 정렬하지 마세요 — 스크린샷에 엄격한 좌측 정렬을 보여줍니다.
• 흰색 외의 배경색을 사용하지 마세요 — 스크린샷에 순수한 흰색 캔버스를 보여줍니다.
• 피하기: 화려하거나 네온 팔레트
• 피하기: UI 요소의 둥근 모서리
• 피하기: 무거운 드롭 섀도우 또는 3D 효과
• 피하기: 기본 내비게이션용 세리프 서체
• 피하기: 밀집된 다열 텍스트 레이아웃
• 피하기: 공격적이거나 영업 중심의 언어

10

팩 안의 실제 스크린샷

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

11

System Prompt

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