01
设计气质 DNA
AI 语音企业创意开发者音频
一个高端录音室界面，呈现在简洁的数字画布上
02
色彩
#000000Ink#777169Ink soft#FDFCFCBG#F5F3F1BG soft#EBE8E4BG quiet#E5E5E5Mutedrgba(0,0,0,0.05)Line在温暖的中性色调上使用高对比度的墨色，并以柔和、有机的渐变作为点缀
03
字体
- display
56px · 500 - heading
32px · 500 - body
18px · 400 - small
14px · 400
04
间距
4px8px16px24px32px48px64px96px统一使用 8px 和 16px 增量来设置 padding 和 gap
05
表面 (圆角 / 阴影 / 边线)
sm · 4px
md · 8px
lg · 20px
pill · 9999px
非常细微的 1px 边框，使用 rgba(0,0,0,0.05) 或 rgb(229,229,229)
0 1px 2px 0 rgba(0,0,0,0.04) · 0 2px 4px 0 rgba(0,0,0,0.04) · 0 0 0 1px rgba(0,0,0,0.06)
06
布局
1280container
12columns
24pxgutter
768 / 1024breakpoints
简洁的单栏布局，拥有充足的留白和居中容器
07
动效与交互
150msmicro
300mssmall
300msmedium
cubic-bezier(0.4, 0, 0.2, 1)easing
hover 时颜色和背景的平滑过渡
颜色和背景色过渡，持续时间 0.15s · 细微的 transform 或 opacity 变化
08
组件
- button 药丸形状 (9999px radius)，主要按钮使用纯黑背景，次要按钮使用白色/描边
- card 浅灰色背景，带有非常细微的 border-radius (20px) 和柔和阴影
- chip 药丸形状，带有 1px border 和透明背景
- input 简洁，带有 1px 细微边框和圆角
- hero 大型加粗标题左对齐，附带说明文字和药丸形按钮
09
文案语气与禁用清单
- 语气 专业、创新且略带趣味
- 标题风格 大型、加粗、几何无衬线标题，字间距紧凑
- 按钮文案 药丸形按钮，主要操作使用纯黑填充
- 不要使用纯白色背景 — 截图显示使用的是温暖的米白色 (#FDFCFC)
- 不要使用尖锐的圆角 — 截图显示大型卡片使用 20px radius，按钮使用 9999px
- 不要使用高饱和度的强调色 — 截图显示使用的是柔和、有机的渐变
- 不要使用纤细、浅色的字体作为标题 — 截图显示展示文本使用 500 字重
- 不要使用复杂的背景 — 截图显示使用的是简洁、基本平坦的表面
- 不要使用紧凑的间距 — 截图显示使用的是充足的 padding (顶部 160px) 和 gap (48px)
- 避免: 鲜艳的颜色
- 避免: 攻击性的排版
- 避免: 杂乱的布局
- 避免: 主文案中的技术术语
10
包内真实截图
11
System Prompt
一款面向企业和创作者的优质 AI 音频平台 (SaaS)。关键颜色：背景使用温暖的米白色 (#FDFCFC)，墨色使用纯黑 (#000000)，以及柔和的中性色调 (#777169, #EBE8E4)。排版结合了几何无衬线字体用于展示，人文无衬线字体用于正文。关键禁忌：避免纯白背景，按钮使用 9999px 药丸形圆角，切勿使用高饱和度强调色，使用充足的留白，展示文本使用 500 字重，避免复杂的背景图案。