01
设计气质 DNA
3D MockupsFramer Components数字资产UI KitDesign Supply
一个存放高品质设计资产的数字仓库。
02
色彩
#101010Ink#555555Ink soft#FFFFFFBG#999999Mutedrgba(224, 224, 224, 1)Line严格遵循无彩色系,运用纯黑与灰色,将焦点保持在产品渲染效果上。
03
字体
- display
54px · 400
所有排版均使用单一的等宽字体家族。 · 标题与 UI 标签始终保持大写。 · 小号文本采用宽松的字间距以增强可读性。
04
间距
4px8px12px16px24px32px40px80px主章节采用统一的 40px 和 80px 外边距。
05
表面 (圆角 / 阴影 / 边线)
sm · 4px
md · 8px
lg · 8px
pill · 999px
1px solid #E0E0E0
0 1px 2px rgba(0,0,0,0.05)
06
布局
1400container
5columns
24pxgutter
768 / 1024breakpoints
响应式网格,由等大的卡片构成。
07
动效与交互
120msmicro
140mssmall
400msmedium
cubic-bezier(0.25, 0.1, 0.25, 1)easing
边框与颜色变化采用快速 120ms 过渡。 · 交互元素带有细腻的透明度与颜色渐隐效果。
边框颜色或背景色的细微变化。 · 即时视觉反馈,配合快速过渡。
08
组件
- button 轮廓式胶囊按钮,采用等宽大写文本。
- card 白色卡片,带细 1px 边框,轻微悬停状态,底部设有标签栏。
- chip 仅轮廓样式,用于顶层导航。
- input 简约的轮廓输入框,搭配等宽文本。
- hero 密集的产品卡片网格,聚焦资产本身而非品牌。
09
文案语气与禁用清单
- 语气 实用、技术、高效。
- 标题风格 大写等宽文本,常带数字前缀。
- 按钮文案 清晰的轮廓按钮或简洁文本链接。
- 切勿使用衬线字体 — 截图显示仅使用等宽字体。
- 切勿使用彩色背景 — 截图显示严格的白灰色调。
- 切勿使用过度圆润的卡片圆角 — 截图显示仅为紧凑的 8px 圆角。
- 切勿使用投影营造深度 — 截图显示采用平面边框。
- 切勿混用不同字重 — 截图显示统一使用 400 字重。
- 切勿在标题中使用小写文本 — 截图显示 UI 标签全为大写。
- 避免: 装饰性元素
- 避免: 圆润友好的形状
- 避免: 多彩渐变
- 避免: 衬线字体
10
包内真实截图
11
System Prompt
099 Supply 是一个极简的数字设计资产市场。其视觉基因定义于无彩色系调色板(FFFFFF 背景,101010 墨色,999999 柔和色,E0E0E0 线条)和严格的等宽排版系统。所有文本均为大写,营造出技术、系统的感受。布局为简洁的响应式网格,由带细 1px 边框的白色卡片构成。关键禁忌:绝不使用衬线字体,绝不引入色彩,绝不使用厚重的投影。品牌定位技术化且实用,面向重视精确与效用而非装饰表达的设计师。为小号文本使用宽松字间距,以在等宽系统中保持可读性。





