精选 · 开放 · 免费
Tofucollective
一个克制、以排版驱动的华语当代艺术编辑平台。
EditorialCleanTypographyGalleryRestraint
01
设计气质 DNA
文化桥梁当代艺术华语集体排版
具有编辑克制力的极简主义画册
02
色彩
#000000Ink
#282828Ink soft
#FFFFFFBG
rgba(0,0,0,1)Line
严格双色调色板的高对比度单色。
03
字体
humanist-sans · system-ui-sans
- display
90px · 400 - body
16px · 400 - caption
12px · 400
为显示标题使用紧凑的行距 · 为所有文本元素保持高对比度 · 将文本严格左对齐
04
间距
4px
8px
16px
24px
32px
48px
64px
96px
严格的 8px 网格,留白充足
05
表面 (圆角 / 阴影 / 边线)
sm · 0px
md · 0px
lg · 0px
pill · 999px
用于分隔导航元素的 1px 实线黑边
06
布局
1280container
12columns
24pxgutter
768 / 1024breakpoints
非对称双栏网格,左侧为重型排版栏,右侧为全高图片
07
动效与交互
220msmicro
400mssmall
800msmedium
cubic-bezier(0.4, 0.24, 0.4, 1)easing
UI 元素的平滑 transform 过渡
交互元素上的微妙 transform 移动 · 通过指针光标提供即时反馈
08
组件
- button 仅文本的导航链接,由竖线分隔
- card 无视觉卡片;内容以原始排版块和图片形式呈现
- hero 全高分屏,左侧为巨型排版标题,右侧为摄影图片
09
文案语气与禁用清单
- 语气 学术、精致、略带诗意
- 标题风格 巨型、小写或混合大小写的显示字体,行距紧凑
- 按钮文案 极简、基于文本的导航,无视觉按钮
- 不要使用圆角——截图显示导航线上有完美的方形边缘
- 不要使用投影——截图显示没有深度的平面
- 不要使用彩色强调按钮——截图显示仅文本导航由线条分隔
- 不要使用装饰性衬线字体——截图显示简洁的无衬线字体排版
- 不要将主标题文本居中对齐——截图显示严格的左对齐
- 不要使用白色以外的背景色——截图显示纯白画布
- 避免: 鲜艳或霓虹色调色板
- 避免: UI 元素上的圆角
- 避免: 浓重的投影或 3D 效果
- 避免: 用于主要导航的衬线字体
- 避免: 密集的多栏文本布局
- 避免: 激进或销售导向的语言
10
包内真实截图
桌面首屏(hero)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
移动首屏抓自真实页面 · 真 computed styles
11
System Prompt
这是一个为华语当代艺术集体设计的极简主义、以编辑为中心的网站。设计基于严格的单色色板,仅使用黑色(#000000)和白色(#FFFFFF),偶尔使用深灰色(#282828)以获得更柔和的墨色调。排版是主要驱动力,使用简洁的 humanist-sans 用于显示,标准的 system-ui 用于正文。布局非对称且基于网格,通常包含行距紧凑的巨型标题。关键禁忌包括避免任何圆角、绝不使用投影,以及保持高对比度、左对齐的文本。整体美学是一种“学术克制”,功能上如同高端艺术画册或展览指南。
en · zh-CN · zh-TW · ja · ko