큐레이션 · 오픈 · 무료

Type Network

프리미엄 타이포그래피 라이선싱과 파운드리 파트너십을 위한 세련된 에디토리얼 플랫폼입니다.

typefoundry
Type Network 스크린샷
↓ 디자인 시스템 다운로드 (7 MB)OpenDesign 에서 열기

원본 사이트: https://www.typenetwork.com

📦 팩 내용 보기 →

01

디자인 DNA

타이포그래피라이선싱파운드리프리미엄에디토리얼

고급 타이포그래피를 위한 큐레이션된 갤러리이자 마켓플레이스로, 박물관의 명성과 라이선싱 플랫폼의 실용성을 결합합니다.

02

컬러

#F56900Accent
#000000Ink
#111111Ink soft
#FFFFFFBG
#777777Muted
rgba(218, 218, 218, 1)Line

날것의 고대비 블랙과 화이트를 기반으로 하여 핵심 메시지를 강조하기 위한 단 하나의 생생한 오렌지 강조색을 사용합니다.

03

타이포그래피

didone-serif · humanist-sans

고전적인 에디토리얼의 우아함을 불러일으키기 위해, 크고 표현적인 디스플레이 타입에는 Didone 세리프를 사용합니다. · 모든 본문 카피, 네비게이션, UI 요소에는 깔끔한 가독성을 위해 Humanist 산세리프를 사용합니다. · 디스플레이 세리프와 산세리프 본문 텍스트 사이에 높은 대비를 유지합니다.

04

여백

4px
8px
16px
24px
32px
48px
64px
96px

공기감 있는 에디토리얼 느낌을 유지하기 위해 넉넉한 수직 패딩이 있는 엄격한 4px 기준선 그리드입니다.

05

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

sm · 4px
md · 8px
lg · 12px
pill · 999px

수평 분리 및 카드 컨테인먼트를 위해 엄격히 사용되는 #DADADA 또는 #CCCCCC의 얇은 1px 실선 테두리입니다.

06

레이아웃

1280container
12columns
24pxgutter
768 / 1024breakpoints

최대 너비가 있는 넓은 단일 칼럼 컨테이너로, 얇은 하이라인 테두리로 구별되는 수평 섹션을 특징으로 합니다.

07

모션과 인터랙션

150msmicro
300mssmall
600msmedium
cubic-bezier(0.4, 0, 0.2, 1)easing

인터랙티브 요소의 색상 및 배경색 전환. · 링크의 text-decoration-color 전환.

인터랙티브 요소의 은은한 색상 변화로, 주로 강조 오렌지색으로 전환하거나 텍스트를 어둡게 만듭니다. · 깔끔하고 절제된 인터랙션 모델을 유지하면서 즉각적인 시각적 피드백을 제공합니다.

08

컴포넌트

09

보이스와 금지 목록

10

팩 안의 실제 스크린샷

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

11

System Prompt

Type Network는 세계적인 파운드리와 글로벌 기업을 연결하는 중개 역할을 하는, 프리미엄이고 큐레이션된 타이포그래피 마켓플레이스입니다. 시각 시스템은 단 하나의 생생한 오렌지(#F56900) 강조색이 있는 고대비 블랙과 화이트를 기반으로 정의됩니다. 본문 카피를 위한 깔끔한 humanist-sans와 표현적인 디스플레이 헤드라인을 위한 세련된 Didone-serif를 결합합니다. 핵심적인 금지 사항은 다음과 같습니다: 드롭 섀도우나 복잡한 그라디언트를 사용하지 마세요; 두꺼운 테두리나 묵직한 드롭 캡스를 사용하지 마세요; 크고 표현적인 헤드라인에 산세리프를 사용하지 마세요. 레이아웃은 권위 있는 에디토리얼 느낌을 유지하기 위해 깔끔한 수평 분리와 넉넉한 여백에 의존합니다.

이 감각을 당신의 에이전트에

이 디자인의 기계 판독 가능한 사양——색상·타이포·모션까지——을 그대로 AI 에이전트에 전달하세요.

OpenDesign 스킬 ↗ · 이 팩 (에이전트용) ↗

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