Tines
暖白色基底、衬线字形与紧密字距。
Relume
近白色基底、渐变展示与大字排版。
页面以近白色为基底，搭配近黑色文字。字体采用 Relative、Relative Faux。视觉特点包括渐变展示、大字排版、细线分隔、居中构图。适合参考的场景：AI 工具官网、产品能力介绍页。
查看原始网站使用规范
建议采用
- Electric Iris #6248ff 仅用于每个表面上意图最强的单一操作。同一屏幕上，绝不能有两个紫罗兰色 CTA 彼此竞争。
- 通过 background-clip:text，把 ember→crimson→iris 渐变应用到每个标题中恰好一个单词上；提示输入框则使用 2px 渐变边框。渐变只能出现在这两个位置。
- 32px 及以上的展示标题采用字重 500，字间距为 -0.02em 至 -0.03em。中等字重与紧密间距的结合，让 Relative 呈现自信而紧凑的姿态。
- 功能卡片和图像使用 16px 圆角，按钮、输入框和徽章使用 8px。不要混用；这套双层尺度就是空间语法。
- Paper #ffffff 的卡片表面，搭配 Cream #f1f0ee 的页面画布与 1px 的 Bone #e4e2df 边框。即使尚未添加阴影，卡片与画布的对比也应已经建立层级。
- 所有次要或弱化文字使用 Fog #686868。Ink #161616 只用于标题、主要文案和深色轮廓按钮文字。
- 让漂浮的预览卡片以轻微旋转角度，错落分布在首屏标题周围，暗示一个正在工作的画布。产品本身就是装饰。
建议避免
- 不要引入第二种彩色强调。网站刻意只保留 1% 的彩色；每增加一种颜色，都会稀释紫罗兰色的效果。
- 阴影不要大于双层卡片阴影 8/10/-4px + 2/10/2px。这套阴影极其轻薄，任何更重的处理都会破坏奶油色画布的轻盈感。
- 正文不要小于 14px 或大于 18px。14–18px 是舒适可读的范围；12–13px 的图注只用于法律说明或元信息。
- 不要把渐变用于背景、按钮或大面积表面。它只属于文字的 background-clip 处理和 2px 输入框边框。
- 不要在浅色表面上用 Acid Lemon #f0f41a 填充。它只适合作为深色表面的强调色，放在 Cream 上会产生令人不适的视觉振动。
- 同一个首屏不要同时放置紫罗兰按钮与深色轮廓按钮，只选其中一种。深色轮廓按钮属于导航，紫罗兰按钮属于提示输入区。
- 不要打破单字体规则。每一级层次，包括 224px 展示文字，都使用 Relative。引入第二种字体会割裂文字语气。
