Reclaim 网站预览
Reclaim 网站预览

Reclaim

白色基底、胶囊形控件与分屏构图。

页面以白色为基底,搭配近黑色文字。字体采用 Poppins、Inter。视觉特点包括胶囊形控件、分屏构图、网格布局、大字排版。适合参考的场景:效率工具官网、协作产品介绍页。

查看原始网站

使用规范

建议采用

  • 所有文字只用 Poppins,生产界面绝不替换为 Inter、Roboto 或系统字体。
  • 所有按钮、标签和头像圆角设为 100px,保持胶囊形身份。
  • Iris Violet #5562eb 是唯一主要操作色,行动按钮绝不引入第二种蓝或强调色。
  • 标题保持字重 300 或 400,展示文字绝不用粗体 600+;低声字重就是标志。
  • 紫罗兰到绿的渐变 linear-gradient(120deg, #5562eb 40%, #7ac17b 61%) 只用于首屏标题中的单词,不用于按钮或背景。
  • 页面基底使用薰衣草画布 #ebefff,全白页面会破坏品牌氛围。
  • Focus Green #7ac17b 留给日历时间块和正向统计数字,不用于成功提示或状态徽章。

建议避免

  • 卡片不要使用投影;Reclaim 以圆角和表面对比代替浮起。
  • 不要引入橙、粉、蓝绿色等新强调色;系统只有 Iris Violet 与 Focus Green 两种彩色。
  • 任何文字都不要用字重 700 或 800,Poppins 最高到 600,展示文字大多为 300-400。
  • 任何容器都不要使用 0px 圆角,最小 3px,卡片标准 10px。
  • 紫罗兰绿色渐变不要用于按钮、背景或完整标题,只用于首屏文字中的个别单词。
  • 页面背景不要用纯白 #ffffff,薰衣草画布才是品牌基底。
  • 悬停或焦点状态不要用 box-shadow,改为色彩切换到 Sapphire Violet #3451e8。