OpenDesign·你的设计资产库

网页参考

Texts

一个 AI 增强的消息中枢,在干净、私密的界面中组织您所有的对话。

ProductMessagingDark

封面待补录,可通过原站查看设计。

01

设计气质 DNA

统一收件箱AI 助手生产力消息传递隐私

一个精简的、由 AI 驱动的指挥中心,用于管理您所有的对话

02

色彩

#2563EBAccent
#101116Ink
#1C2022Ink soft
#FFFFFFBG
#F9FAFBBG soft
#F5F7FABG quiet
#697882Muted
rgba(226, 232, 240, 1)Line

高对比度、以可访问性为重点的调色板,以专业蓝色调为主导。

03

字体

humanist-sans · monospace

  • display56px · 700
  • h148px · 700
  • body16px · 400

04

间距

4px
8px
12px
16px
20px
24px
32px
48px
56px
64px

标准 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 圆角。整体感觉是现代、高效且值得信赖的。

把这份品味接进你的 Agent

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

OpenDesign 技能 ↗

复制给 Agent

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