Attio
白色基底、紧密字距与细线分隔。
Lazy
深蓝色基底、宽松留白与衬线字形。
页面以深蓝色为基底，搭配白色文字。字体采用 Migra、Inter。视觉特点包括宽松留白、衬线字形、居中构图。适合参考的场景：效率工具官网、协作产品介绍页。
查看原始网站使用规范
建议采用
- 所有层级的展示标题使用 Migra 58px 字重 500，字间距 0.048em——这是品牌的声调
- 正文文本使用 Inter 16px 字重 400，行高 1.5，以获得舒适的阅读节奏
- 为所有浮动的 UI 元素（如命令栏和模态框）应用双层阴影堆叠（rgba(4,4,7,0.25) 0 2px 4px + rgba(4,4,7,0.4) 0 8px 24px）
- 卡片保持 8px 圆角，按钮保持 4px 圆角——这种 2:1 的比例在系统中保持一致
- 使用 #8a8c93 作为默认边框颜色，宽度为 1px——它是系统中使用频率最高的色值（1357 次出现），定义了视觉结构
- 所有首屏和区块内容均居中对齐；Lazy 采用对称、冥想式的布局——主要标题绝不能左对齐
- 每个衬线标题必须搭配一个无衬线副标题，颜色为 #8a8c93——Migra 与 Inter 之间的对比构成了 Lazy「编辑风格与 UI 设计」的统一身份
建议避免
- 绝不引入彩色——整个系统以无彩色为设计原则；加入蓝色或绿色将破坏编辑语境
- 绝不使用实心填充的 CTA 按钮；所有操作按钮均为透明描边（透明描边/描边）并带有 #62646a 边框，以维持安静的美学
- 绝不将正文文本字间距收紧于 -0.005em 以下，或使展示文本字间距放宽于 0.138em 以上——字间距曲线是系统的基准
- 绝不使用小于 21px 的 Migra——在更小尺寸下，衬线字体将失去其编辑特征，转而成为噪音
- 绝不添加强于文档记录值的投影阴影——Lazy 以轻盈姿态漂浮，从不投射出硬边
- 绝不左对齐衬线展示标题——必须居中，以维持手稿排版的隐喻
- 绝不使用白色（#ffffff）作为背景；白色仅用于正文和笔记预览卡片的对比时刻
