01
设计气质 DNA
统一收件箱AI 助手生产力消息传递隐私
一个精简的、由 AI 驱动的指挥中心,用于管理您所有的对话
02
色彩
#2563EBAccent#101116Ink#1C2022Ink soft#FFFFFFBG#F9FAFBBG soft#F5F7FABG quiet#697882Mutedrgba(226, 232, 240, 1)Line高对比度、以可访问性为重点的调色板,以专业蓝色调为主导。
03
字体
- display
56px · 700 - h1
48px · 700 - body
16px · 400
04
间距
4px8px12px16px20px24px32px48px56px64px标准 4px 网格,为大量留白的区块提供宽裕的内边距。
05
表面 (圆角 / 阴影 / 边线)
sm · 4px
md · 12px
lg · 16px
pill · 9999px
1px solid rgb(226, 232, 240)
rgba(0, 0, 0, 0.1) 0px 1px 3px 0px · rgba(0, 0, 0, 0.2) 0px 4px 16px 0px
06
布局
1280container
12columns
24pxgutter
768 / 1024breakpoints
为内容部分采用居中的单栏布局,并提供宽裕的垂直内边距。
07
动效与交互
200msmicro
220mssmall
700msmedium
cubic-bezier(0.4, 0, 0.2, 1)easing
用于内边距和高度变化的平滑布局过渡 · 用于状态变化的细微透明度渐变
交互元素使用标准指针光标。 · 在交互区域保持指针光标。
08
组件
- button 高对比度的 CTA,采用药丸形状圆角(9999px)、粗体字重和方向箭头。
- card 干净的白色容器,带有细微的圆角(12px)和柔和的阴影。
- chip 最小化的标签/组件,带有浅色边框。
- input 干净、带边框的输入字段,具有标准内边距。
- hero 粗体、居中对齐的排版,置于干净背景之上,并包含一个强有力的单一行动号召。
09
文案语气与禁用清单
- 语气 自信、透明、前瞻性
- 标题风格 粗体、陈述性语句,强调创新与组织
- 按钮文案 直接、以行动为导向,并带有方向性提示(箭头)
- 不要使用衬线字体 —— 截图显示所有排版均使用干净的无衬线字体族。
- 不要使用霓虹色或高度饱和的次级颜色 —— 截图显示了克制的蓝色、白色和深灰色调色板。
- 不要使布局杂乱 —— 截图显示了宽裕的留白和专注的内容部分。
- 不要在主要元素上使用尖锐的方形圆角 —— 截图显示卡片为 12px 圆角,按钮为 9999px 圆角。
- 不要使用厚重、侵略性的阴影 —— 截图显示了非常细微、低不透明度的投影阴影。
- 不要使用复杂的装饰性插图 —— 截图依赖于干净的文本、简单的图标和界面截图。
- 避免: 技术术语
- 避免: 过于正式的语言
- 避免: 被动语态
10
包内真实截图












11
System Prompt
这是一个干净、专业的 SaaS 界面,用于一款 AI 驱动的生产力工具。它使用高对比度调色板,背景为白色(#FFFFFF),深色墨迹(#101116),并以蓝色调(#2563EB)为主导。排版完全使用无衬线字体(Inter),具有粗体、负字间距的标题。关键禁忌:避免衬线字体,不要使用霓虹色或饱和的次级颜色,切勿用不必要的装饰元素使布局杂乱。保持宽裕的留白,并为表面使用 12px 圆角。整体感觉是现代、高效且值得信赖的。