Vapi 网站预览
Vapi 网站预览

Vapi

近黑色基底、等宽文字标注与细线分隔。

页面以近黑色为基底。字体采用 seasonSans、Geist Mono。视觉特点包括等宽文字标注、细线分隔。适合参考的场景:AI 服务首页、产品演示介绍页。

查看原始网站

使用规范

建议采用

  • 所有卡片、输入框和代码块都采用5.6px圆角;硬朗角度是标志性特征,而非折衷。
  • 每个操作按钮和Talk-to-Vapi控制台都使用9999px圆角。
  • 标题采用seasonSans 300字重和-0.025em letter-spacing;不要为了匹配深色UI惯例而加粗。
  • Ember Orange和Mint Pulse只能作为相邻的同级CTA配对;同一表面上绝不要只使用其中一种。
  • Iron Border(#27272a)以1px细线使用,出现频次为490+;它是结构骨架,而非装饰。
  • 任何需要像开发者控制台而非营销文案的标签,都采用Geist Mono和+0.08em字间距。
  • 频谱波形图形可以同时承载全部六种鲜亮颜色;页面中其他任何元素都不应复制这套调色板。

建议避免

  • 不要用drop-shadow或box-shadow表现抬升;深度只来自Void、Carbon和Slab之间的背景对比。
  • 卡片圆角不要超过5.6px;硬朗几何让系统像控制台,而非营销网站。
  • 任何UI元素都不要使用Spectrogram Blue、Pink、Yellow或Violet;它们只保留给首屏波形图形。
  • 文字不要采用纯白(#ffffff);Cream Text(#fffaea)是有意选择的温暖替代色。
  • Ember与Mint按钮不要形成超过两个按钮的一排;配对是二元的,加入第三个中性按钮会破坏信号。
  • 正文字号不要低于15px,Geist Mono语境之外也不要使用装饰性字间距。
  • 不要添加渐变、辉光或极光背景;设计保持平面,唯一的色彩动势来自静态频谱图形。