OpenDesign·你的设计资产库

网页参考

Tofucollective

一个克制、以排版驱动的华语当代艺术编辑平台。

EditorialCleanTypographyGalleryRestraint
Tofucollective 网站截图

01

设计气质 DNA

文化桥梁当代艺术华语集体排版

具有编辑克制力的极简主义画册

02

色彩

#000000Ink
#282828Ink soft
#FFFFFFBG
rgba(0,0,0,1)Line

严格双色调色板的高对比度单色。

03

字体

humanist-sans · system-ui-sans

  • display90px · 400
  • body16px · 400
  • caption12px · 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

包内真实截图

历史提取与模型分析 · 尚未逐项校验

11

System Prompt

这是一个为华语当代艺术集体设计的极简主义、以编辑为中心的网站。设计基于严格的单色色板,仅使用黑色(#000000)和白色(#FFFFFF),偶尔使用深灰色(#282828)以获得更柔和的墨色调。排版是主要驱动力,使用简洁的 humanist-sans 用于显示,标准的 system-ui 用于正文。布局非对称且基于网格,通常包含行距紧凑的巨型标题。关键禁忌包括避免任何圆角、绝不使用投影,以及保持高对比度、左对齐的文本。整体美学是一种“学术克制”,功能上如同高端艺术画册或展览指南。

把这份品味接进你的 Agent

把这套设计的机器可读规格——色彩、字体、动效,整套 DNA——直接交给你的 AI Agent。

OpenDesign 技能 ↗

复制给 Agent

参考链接与来源说明,可复制给 Agent。