Attio
白色基底、紧密字距与细线分隔。
Tana
近黑色基底、紧密字距与细线分隔。
页面以近黑色为基底，搭配近白色文字。字体采用 SF Pro、tanaClassic。视觉特点包括紧密字距、细线分隔、摄影展示、衬线字形。适合参考的场景：工作流工具首页、产品功能说明页。
查看原始网站使用规范
建议采用
- 仅在每屏最重要的操作上使用 #e1f0bd（青色信号），绝不用于链接、图标、标签或装饰
- 将首屏标题设为 84px tanaClassic 400，字间距 -3.78px——负字间距是让衬线字体具有编辑感而非默认风格的关键
- 使用 SF Pro 300 字重（24–29px）作为副标题，使其在衬线字体展示后退，层级关系为：衬线 > 灰色无衬线 > 正常无衬线
- 以 15px 间距将五边形分类标签环绕图像，其尖角指向左侧，朝向其所描述的视觉内容
- 正文行高设为 1.75（用于叙述）和 1.50（用于 UI）——充足的行高抵消了深色背景带来的视觉压迫
- 除主要行动按钮外，页面整体色彩饱和度保持 0%，杜绝添加任何辅助色、渐变或彩色插图
- 按钮和图片仅使用 10px 圆角——标签、卡片和区块保持锐利（0px），以维持编辑风格的精确性
建议避免
- 绝不使用第二个辅助色——系统的身份依赖于青色作为唯一的色彩元素
- 绝不使用阴影、高光或模糊效果——深度来自表面色调变化，而非立体效果
- 绝不将衬线标题设置为正常或正字间距——负字间距是该字体的标志性特征
- 绝不使用 SF Pro 500 以上的字重用于副标题——轻量级（300）才是衬线字体主导语气的关键
- 绝不将青色强调用于除主要 CTA 按钮之外的背景——禁止使用青色卡片、标签、边框或高亮
- 绝不使用纯白色 #ffffff 作为文字——应使用 #f0eded（骨色）以在黑色画布上提供温暖感
- 绝不使用 4px 或 8px 等通用圆角值——系统承诺按钮/图片使用 10px，其余一律为 0px
