01
设计气质 DNA
字体排版授权字库高端编辑式
一个为高端字体排版策划的画廊与市场,兼具博物馆的声望与授权平台的实用性。
02
色彩
#F56900Accent#000000Ink#111111Ink soft#FFFFFFBG#777777Mutedrgba(218, 218, 218, 1)Line以极简、高对比度的黑白色为基础,搭配单一的活力橙色强调色,以突出核心信息。
03
字体
- display
96px · 400 - h1
24px · 400 - body
18px · 400 - small
14px · 400
使用Didone衬线字体作为大号、富有表现力的标题字体,唤起经典的编辑优雅感。 · 所有正文、导航和UI元素使用人文主义无衬线字体,确保清晰的可读性。 · 保持标题衬线字体与正文无衬线字体之间的高对比度。
04
间距
4px8px16px24px32px48px64px96px严格的4px基线网格,配合充足的垂直padding,保持编辑式的开阔感。
05
表面 (圆角 / 阴影 / 边线)
sm · 4px
md · 8px
lg · 12px
pill · 999px
使用1px的#DADADA或#CCCCCC纯色细边框,仅用于微妙的水平分隔和卡片容器。
06
布局
1280container
12columns
24pxgutter
768 / 1024breakpoints
一个带有最大宽度的宽单栏容器,包含由细发丝线边框分隔的明显水平区段。
07
动效与交互
150msmicro
300mssmall
600msmedium
cubic-bezier(0.4, 0, 0.2, 1)easing
交互元素的颜色和背景颜色过渡。 · 链接的文本装饰颜色过渡。
交互元素上的微妙颜色变化,通常过渡到强调橙色或使文本颜色变深。 · 立即的视觉反馈,保持简洁、克制的交互模型。
08
组件
- button 极简的幽灵或轮廓按钮,带有1px实线边框、小字体和箭头图标。
- card 简洁的白色卡片,带有1px细边框,内含图标、加粗标题、正文和一个幽灵按钮。
- chip 带有微妙边框的最小化标签或标签。
- input 简单的文本输入框,采用标准浏览器样式或微妙边框。
- hero 一个巨大的、富有表现力的橙色衬线字体标题,后接一段大号无衬线字体正文。
09
文案语气与禁用清单
- 语气 自信、权威且精致。以高端设计工具的专业策展人身份发言。
- 标题风格 直接、有力,常使用大型衬线字体以达到最大的视觉冲击力。
- 按钮文案 微妙、克制的幽灵按钮,配有简单文字和箭头,让排版主导视觉。
- 不要使用投影——截图显示的是仅通过1px细边框分隔的扁平表面。
- 不要为首要操作使用圆角药丸按钮——截图显示的是带有4px圆角的矩形按钮。
- 不要为主要内容标题使用无衬线字体——截图显示的是一种大型Didone衬线字体。
- 不要使用复杂的多彩背景——截图显示的是纯白色背景。
- 不要为正文使用厚重、加粗的字重——截图显示所有标准文本使用字重400。
- 不要使用粗边框——截图显示的是浅灰色的、微妙的1px细边框。
- 避免: 避免使用过于随意或对话式的语言。
- 避免: 避免使用密集、杂乱且缺乏清晰水平分隔的布局。
- 避免: 避免为大号、富有表现力的标题使用无衬线字体。
- 避免: 避免过度使用圆角;保持边角锐利或仅轻微圆角。
- 避免: 避免使用投影或厚重的box-shadow来营造深度感。
- 避免: 避免使用明亮、多彩的调色板;保持严格的黑-白-橙配色方案。
10
包内真实截图
11
System Prompt
Type Network 是一个高端、精选的字体排版市场,在世界顶级字库与全球企业之间充当桥梁。其视觉系统以高对比度的黑白为基础,配以单一的活力橙色(#F56900)强调色。它将精致的Didone衬线字体用于富有表现力的标题,将清晰的人文主义无衬线字体用于正文。关键禁令包括:不要使用投影或复杂渐变;不要使用粗边框或厚重的首字下沉;不要为大号标题使用无衬线字体。布局依靠清晰的水平分隔和充足的留白,以保持权威的编辑式氛围。








