Buddy
工程蓝图绘制在格纸上。白色草图表面带有细微网格，以近黑色墨线勾勒，点缀着荧光的 黄绿色 注释和虹彩渐变笔触。
Juicebox.ai
人才招聘指挥中心在奶油色纸上
Juicebox 采用一种人才招聘指挥中心的语境：近白色的画布表面，一个饱和的皇家紫色占据主导，用于填充首屏区域和产品框，搭配紧凑且超大尺寸的无衬线标题，整体感觉更像高管备忘录而非SaaS营销内容。界面刻意保持安静——细线边框、2px圆角、等宽技术标签——使得紫色的瞬间（首屏背景、激活标签、产品框）如同在灰度仪表盘上突然出现的电压跳变。正文使用无衬线字体，字号14–18px，字间距略作收紧；展示文本采用新式无衬线显示字体，负字间距强烈，字号40–72px，将标题压缩成自信且紧凑的方块。组件设计简洁、矩形、无装饰：无圆角按钮，无阴影，控件上无渐变。通过表面亮度和一个仅用于激活/按下状态的内嵌阴影来暗示层级感。
查看原始网站使用规范
建议采用
- 将 #6a2f8d 皇家紫作为唯一品牌强调色——用于首屏背景、激活状态、产品框体、搜索栏提交按钮以及公告横幅。禁止用于正文文本，或单个页面中超过一个元素。
- 所有展示标题（40–72px）使用 Roobert 400 字重，字间距在 -0.03em 至 -0.04em 之间。强烈的负字间距是其标志性特征——不得放松。
- 每个区块眉题标签、标签页文字和技术标签采用DM Mono，字间距0.077em。等宽字体表明“这是元信息，而非段落文字”。
- 所有交互元素（按钮、输入框、卡片、标签、产品框）默认使用 2px 圆角。方形边角是系统工程风格的一部分。
- 页面表面层级仅分为三个层级：Parchment #f8f6f8（页面）→ Paper #ffffff（卡片）→ Plum Mist #eee8fd（强调区域）。通过表面亮度而非阴影来暗示层级感。
- 将填充深色行动按钮（#2a232a）与镂空透明描边按钮（1px #1d161d 边框）设置为相同尺寸和内边距，使其在每个功能区域并列呈现时读作一组匹配的控件。
- 设置正文文字大小为14–18px，使用Haas Grot 400字体，行高为1.43–1.56，字间距为-0.01em。段落文字的字号绝不可低于14px，行高也不可超过1.56。
建议避免
- 不要使用 #000000 作为文本颜色——使用 #1d161d Obsidian。纯黑色会破坏温暖的 Parchment 画布，并破坏系统微妙的紫色底色。
- 不要将圆角超过 2px。该系统刻意保持矩形；8px 或 12px 的圆角会立即被识别为不同产品的风格。
- 不要在卡片或区块上添加阴影。层级感来自 Parchment 到 Paper 的两层表面，而非盒阴影。单个内嵌阴影 rgba(0,0,0,0.5) 0 0 12px inset 仅保留用于激活/按下按钮状态。
- 不要在白色背景上使用皇家紫 #6a2f8d 作为文本颜色。它在正文文本中对比度不足；仅保留用于 Plum Mist 背景上的标题、按钮和装饰元素。
- 不要将 Roobert 与其它显示字体混合使用，也不要将标题设为 700 字重。单一 400 字重是整个系统的标志——加粗标题会破坏编辑基调。
- 不要引入新的饱和色。配色系统刻意保持近单色，仅包含一个品牌紫、一个绿色强调、一个洋紫轮廓。引入青色、红色或琥珀色会立即稀释系统风格。
- 不要用颜色强调正文文本。使用 Obsidian #1d161d 加粗进行行内强调，仅用绿色 #2f8d6 为个别高亮词汇突出，绝不用于整句话的强调。
