01
设计气质 DNA
持久工作流坚不可摧扩展代理
一个可靠、工业强度级别的代码运行平台,确保无故障运行。
02
色彩
#CBB26AAccent#FAFAF9Ink#A8A29EInk soft#0C0A09BG#1C1917BG soft#292524BG quiet#9CA3AFMutedrgba(168, 162, 158, 0.2)Line深色、高对比度主题,搭配温暖的石质中性色和单一的金色主操作强调色。
03
字体
- display
60px · 500 - body
16px · 400
标题字体采用紧凑的 -2px 字间距以获得最大视觉冲击力。 · 正文采用标准的 16px 字号,以优化深色背景上的可读性。 · 主要品牌字体为简洁、几何化的无衬线字体。
04
间距
4px8px16px24px32px48px64px96px采用一致的 4px 网格系统,各区块间留有充裕的间距以提供呼吸空间。
05
表面 (圆角 / 阴影 / 边线)
sm · 4px
md · 8px
lg · 12px
pill · 9999px
使用 rgba(168, 162, 158, 0.2) 绘制细微的 1px 边框,以定义边缘而不产生强烈对比。
0px 1px 2px rgba(0, 0, 0, 0.1) · 0px 1px 3px rgba(0, 0, 0, 0.1)
06
布局
1280container
12columns
24pxgutter
768 / 1024breakpoints
居中内容布局,拥有充裕的垂直留白和清晰的视觉层级。
07
动效与交互
150msmicro
150mssmall
400msmedium
cubic-bezier(0.4, 0, 0.2, 1)easing
悬停时微妙的颜色和背景过渡。 · 交互元素的变形效果。
按钮和链接在悬停时背景颜色或透明度的微妙变化。 · 通过变形或透明度变化提供即时视觉反馈。
08
组件
- button 主按钮使用金色强调色配深色文字;次按钮使用透明背景配白色边框。
- card 深色容器(bgSoft/bgQuiet),带有细微边框和轻微内边距。
- chip 用于标签或标记,通常带有细微边框或柔和背景色。
- input 简洁、极简的输入框,带有细微边框和聚焦状态。
- hero 大号、粗体字体搭配抽象几何背景图案。
09
文案语气与禁用清单
- 语气 自信、技术性强且注重可靠性。
- 标题风格 简短、有力、以收益为导向(例如:“默认让任何代码都持久运行”)。
- 按钮文案 直接且面向行动(例如:“免费开始构建”,“获取演示”)。
- 不要使用明亮的霓虹色 — 截图显示的是柔和的石质和金色调。
- 不要使用宽大、装饰性的字体 — 截图显示的是紧凑、几何化的无衬线标题。
- 不要使用厚重阴影或玻璃拟态效果 — 截图显示的是细微、基于平面边框的深度感。
- 不要使用纯黑色(#000000)作为背景 — 截图显示的是温暖的近黑色(#0C0A09)。
- 不要为主要按钮使用圆润的药丸形状 — 截图显示的是锐利的 4px 圆角。
- 不要使用多种相互竞争的强调色 — 截图显示的是单一主导的金色强调色。
- 避免: 避免使用过于随意或俏皮的语言。
- 避免: 避免使用模糊的营销套话。
- 避免: 避免使用缺乏上下文的复杂术语。
10
包内真实截图
















11
System Prompt
Inngest 是一个开发者工具 SaaS 平台,具有深沉、高端的审美。其设计 DNA 基于温暖的近黑色背景(#0C0A09),搭配高对比度的白色文字(#FAFAF9)和柔和的石质强调色(#A8A29E)。单一的金色强调色(#CBB26A)用于主要行动号召。字体方面,标题使用简洁、几何化的无衬线字体,字间距紧凑;正文使用人文主义无衬线字体。布局居中且宽敞,采用 12 列网格。关键禁忌:不要使用明亮的霓虹色,不要使用厚重阴影或玻璃拟态效果,不要使用纯黑色背景。整体感觉是技术性、可靠且精致,面向构建稳健系统的工程团队。
