01
设计气质 DNA
深思熟虑专注团队沟通
一个安静、井然有序的团队帖子图书馆。
02
色彩
#fb432cAccent#171717Ink#737373Ink soft#ffffffBG#f5f5f5BG soft#f0f0f0BG quiet#a3a3a3Mutedrgba(0, 0, 0, 0.1)Line高对比度极简主义:以深墨色为锚点的清爽白色界面,并用鲜明的橙红色强调关键操作。
03
字体
- display
56px · 500 - h2
32px · 600 - body
16px · 400 - small
14px · 400
大型展示文本采用负字距 · 正文使用常规字重 · 章节标题使用半粗体
04
间距
4px8px12px16px24px32px48px64px96px基于4px的统一基础网格
05
表面 (圆角 / 阴影 / 边线)
sm · 4px
md · 8px
lg · 12px
pill · 9999px
1px solid rgba(0, 0, 0, 0.1)
0px 3px 6px -3px rgba(0, 0, 0, 0.05) · 0px 1px 2px 0px rgba(0, 0, 0, 0.05) · 0px 1px 0px -1px rgba(0, 0, 0, 0.05)
06
布局
1280container
12columns
24pxgutter
768 / 1024breakpoints
标准的营销网站布局,内容居中且留白充足。
07
动效与交互
100msmicro
200mssmall
400msmedium
cubic-bezier(0.4, 0, 0.2, 1)easing
悬停时平滑的颜色过渡 · 交互时细微的box-shadow变化
细微的颜色或背景变化。 · 即时的视觉反馈。
08
组件
- button 圆润的药丸形状,采用描边或实心的主色。
- card 干净的白色容器,带有细微边框和柔和阴影。
- chip 带有细微背景的小型圆角标签。
- input 带有浅色边框的标准文本输入框。
- hero 居中的大标题,辅以支持性文案和产品截图。
09
文案语气与禁用清单
- 语气 专业且平易近人。
- 标题风格 简洁、直接、以利益为导向。
- 按钮文案 简洁、行动导向的文本,置于圆角按钮内。
- 不要使用深色或暗色模式背景——截图显示为明亮的白色界面(#ffffff)。
- 不要使用尖锐的直角——截图显示的是药丸形状(9999px)和圆角卡片(8px–12px)。
- 不要使用喧闹、复杂的渐变——截图显示的是干净的纯色背景,配以单一的橙色强调。
- 不要使用过于装饰性或花哨的字体——截图显示的是简洁、功能性的无衬线字体。
- 不要将元素拥挤排列——截图显示了充足的留白(基于4px网格)。
- 不要使用生硬的投影——截图显示的是非常细微、低透明度的box-shadow。
- 避免: 充满行话的语言
- 避免: 过于喧闹或激进的营销文案
- 避免: 视觉混乱
10
包内真实截图
11
System Prompt
Campsite是一款为远程团队打造的专注团队沟通工具。其设计基因建立在干净、高对比度的极简美学之上:明亮的白色(#ffffff)界面、深墨色(#171717)文本,以及用于主要操作的鲜明橙红色(#fb432c)强调色。字体采用人文无衬线类别,大型展示文本使用负字距。关键设计约束:不要使用暗色模式或复杂渐变,不要使用尖锐直角(始终使用圆润的药丸形状或柔和的圆角),并且不要拥挤布局(保持充足的留白)。










