Qatchup
近白色基底、手绘图形与胶囊形控件。
Tracky
近白色基底、手绘图形与紧密字距。
页面以近白色为基底。局部操作控件以红色强调。字体采用 GRIFTER、Inter。视觉特点包括手绘图形、紧密字距、居中构图、宽松留白。适合参考的场景：效率工具官网、协作产品介绍页。
查看原始网站使用规范
建议采用
- 首屏和区块开篇使用 GRIFTER，字号为 64px+，字重为 700。其手工印刷气质是品牌声音，而非装饰。
- 每个标题恰好只为一个单词或短语使用 Coral Emphasis #ff5858，以带来活力；绝不用于整个标题。
- 标准主要 CTA 采用 8px 圆角，Inkwell Navy #151b31 填充与 Paper White #ffffff 文字配对。
- 所有页面都使用 Ash Canvas #f2f2f2 背景，让白色卡片具有从暖纸上抬升的感觉。
- 功能卡片使用暖石色阴影 rgba(138,133,125,0.2) 0 1px 4px，而不是冷黑阴影。
- 所有界面文字都使用 Inter，字间距为 -0.01em；展示尺度的个性交给 GRIFTER。
- 将一张倾斜的 Paper White 卡片叠在深色 Inkwell Navy 功能卡片上，形成直观的产品演示场景。
建议避免
- GRIFTER 不要用于正文、按钮、导航或表单标签。它在小于 24px 时会失去可读性，也会稀释品牌声音。
- 每个视觉区域不要在超过一个元素上应用 Coral Emphasis #ff5858。过度使用会让它失去强调作用。
- 背景或大面积填充不要使用纯 #000000。Inkwell Navy #151b31 是系统的黑色，纯黑只留给图标描边。
- 抬升组件不要叠加多道粗重阴影。系统依靠 1-4px 模糊与低于 25% 的不透明度。
- 交互元素圆角不要小于 8px。柔和感是友好个性的一部分。
- 卡片不要采用 rgba(0,0,0,*) 的冷灰投影。暖石色阴影是标志性的纵深处理。
- 不要引入新的强调色。系统通过海军蓝、珊瑚色、薄荷色和奶油黄表达，添加更多颜色会破坏笔记本配色。
