OpenDesign·你的设计资产库

网页参考

Cartesia

Cartesia是一家AI初创公司,专注于构建类人语音智能体的基础模型和开发者工具。

AIVoice
Cartesia 网站截图

01

设计气质 DNA

AI研究语音智能体企业基础模型

一个专业的研究实验室,拥有精致、现代的企业产品层。

02

色彩

#1B7A3DAccent
#1A1A1AInk
#555555Ink soft
#FAFAFABG
#F0F7F0BG soft
#D6E5D6Muted
rgba(223, 237, 223, 1)Line

在浅色、自然的背景上使用高对比度的深色墨迹,并以单一的深绿色点缀来象征增长与自然。

03

字体

transitional-serif · humanist-sans · modern-monospace

  • display56px · 400
  • headline36px · 400
  • body16px · 400
  • caption14px · 500

使用衬线体作为展示和主视觉文本,以传达权威和研究深度。 · 使用无衬线体作为UI和正文文本,以获得最佳可读性。 · 使用等宽体作为技术标签和数据点。

04

间距

4px
8px
16px
24px
32px
48px
64px
96px

严格的4px基础网格,主要内容区块间留有充足的留白。

05

表面 (圆角 / 阴影 / 边线)

sm · 4px
md · 8px
lg · 12px
pill · 999px

1px solid #DFEDDF

0 1px 2px rgba(0,0,0,0.05)

06

布局

1200container
12columns
24pxgutter
768 / 1024breakpoints

12栏网格,大型主视觉区域与2栏分栏布局交替出现。

07

动效与交互

150msmicro
300mssmall
500msmedium
cubic-bezier(0.4, 0, 0.2, 1)easing

悬停时的微妙透明度渐变 · 按钮上的平滑颜色过渡 · 插图的视差或滚动触发揭示

背景颜色略微变深或文字颜色变为绿色。 · 按钮的缩小微交互。

08

组件

  • button 药丸形主按钮,深绿色背景;次级按钮,带细绿色边框。
  • card 极简内容卡片,带微妙绿色调背景或细边框。
  • chip 小型圆角分类标签,用于行业领域如‘金融’和‘医疗’。
  • input 简洁的文本输入框,带细微的底边框或细轮廓。
  • hero 大型衬线字体文本块,配以描述性段落和双行动号召按钮。

09

文案语气与禁用清单

  • 语气 学术但易懂,自信且前瞻。
  • 标题风格 使用较长的描述性句子,简洁地解释复杂概念。
  • 按钮文案 直接且有吸引力,常强调‘尝试’或‘联系’。
  • 不要使用深色模式主题——截图显示为持续的浅色、明亮背景。
  • 不要使用强烈的渐变——截图显示为纯色和微妙色调。
  • 不要使用厚重的投影——截图显示为非常扁平、极简的立体效果。
  • 不要使用霓虹或高饱和度的强调色——截图使用单一、深沉、自然的绿色。
  • 不要使用高度装饰性或手写字体——截图使用干净、易读的字体。
  • 不要使用项目过多的杂乱导航——截图显示的是精简、宽敞的顶部导航栏。
  • 避免: 炒作驱动或过于随意的语言。
  • 避免: 视觉元素过多、过于拥挤的布局。
  • 避免: 侵略性的销售策略或闪烁元素。

10

包内真实截图

历史提取与模型分析 · 尚未逐项校验

11

System Prompt

Cartesia是一家AI初创公司,定位为类人语音智能体提供基础研究和工具。设计体现了‘研究实验室遇上企业产品’的身份。色彩方案以近白背景(#FAFAFA)和深炭墨色(#1A1A1A)为基础,标志性自然绿色(#1B7A3D)用于点缀和高光。字体使用过渡衬线体(PP Kyoto)作为展示文本,与简洁的人文无衬线体(ABC Diatype)作为正文和UI形成对比。关键设计约束:完全避免深色模式,保持充足的留白,仅使用微妙的纯色边框或色调,而非厚重的阴影或复杂的渐变。

把这份品味接进你的 Agent

把这套设计的机器可读规格——色彩、字体、动效,整套 DNA——直接交给你的 AI Agent。

OpenDesign 技能 ↗

复制给 Agent

参考链接与来源说明,可复制给 Agent。