Amie

阳光洒落的生产力仪表盘 — 一个所有元素均为白色、扁平且目的明确的工作空间,仅有一个电蓝色开关可开启功能。
Amie 仿佛是一个明亮的生产力工作空间 — 白色表面干净整洁,几乎呈现出临床式的克制,仅以一个电蓝色 (#11a8ff) 突出,且仅在需要操作时才会激活。页面整体极为中性 — 98% 无彩色 — 每一个彩色元素('没有机器人'的琥珀高亮、绿色日历图标、紫色标签)都显得刻意而富有意义,而非装饰性。Inter 在字间距为负值 (-0.025em,在显示尺寸下) 的情况下,使标题内容紧凑成自信的块状,且不出现极端字重 — 56px 字号、700 字重的文本读来坚定但不咄咄逼人。卡片使用 1px 细线边框,通过叠加几乎不可见的阴影实现,而非可见的描边,使产品 UI 预览呈现出略微浮于页面之上的视觉效果。位于填充型 CTA 旁的透明 '请求演示' 按钮,构建出一对选择架构,这一设计模式贯穿整个页面。
查看原始网站使用规范
建议采用
- 所有填充型 CTA 按钮必须使用 #11a8ff,其他任何 UI 元素不得使用彩色填充。
- 所有使用 Inter 的显示与区块标题,分别在 56px 时字间距为 -1.40px,40px 时为 -0.48px
- 卡片边框通过3 层阴影堆叠(rgba(0,0,0,0.06) 0px 0px 0px 1px ...)渲染,而非使用明确的边框颜色属性
- 所有标签/胶囊形控件/分类标签组件使用 9999px 半径,卡片和主要按钮使用 12px 半径
- 在 span 元素层级使用 #fbefaf 背景,在行内突出关键统计数据或短语;每个首屏区域仅应用一次,以保留强调效果。
- 在辅助场景中保持灰度(1)滤镜应用于合作伙伴/社交证明标志和产品截图
- 类别强调色 (#01ca45, #a050ff) 仅用于标签边框,禁止用于填充任何 UI 表面
建议避免
- 绝不添加第二个彩色操作色 — #11a8ff 是唯一的 CTA 填充色;其他颜色将破坏层级结构
- 正文文本的字重不得低于 400,也不得高于 700 — 整个系统仅使用 400 至 700 的字重范围
- 避免为卡片显式声明边框 — 采用阴影作为边框的技术(0.06 不透明度环)是保持表面融合而非分离的关键
- 绝不使用 #a0a0a0 或 #5c5c5c 作为标题颜色 — 这些颜色仅限于次级正文和标签使用
- 正文段落绝不居中对齐 — 保持左对齐,且以 16px 的副标题基线为统一内容排版标准
- UI 组件中绝不使用渐变 — 天空渐变 (#cfeeff → #41baff) 仅用于突出短语的装饰性背景,不应用于按钮或卡片
- 不要在导航栏外部应用背景滤镜模糊效果 — 该效果仅出现在滚动时的固定导航栏