Twingate
近黑色基底、胶囊形控件与大字排版。
Firecrawl
浅色基底、胶囊形控件与圆角卡片。
页面以浅色为基底，搭配近黑色文字。字体采用 Suisse、Geist Mono。视觉特点包括胶囊形控件、圆角卡片、网格布局、紧密字距。适合参考的场景：AI 工具官网、产品能力介绍页。
查看原始网站使用规范
建议采用
- 仅使用 #ff4d00 用于功能强调：CTA 填充、激活状态、标题中高亮词汇、徽章点和火图标。绝不用于大面积装饰区域。
- 正文文本设为 14px Suisse 400 字重，标题和交互元素使用 500 字重——450 字重不用于界面文本。
- 所有按钮、标签和交互型胶囊控件均使用 999px 半径；输入框和代码窗口使用 8px；卡片使用 16px。绝不混合不同层级。
- 使用 #e5e7eb 1px 边框作为主要视觉结构——它们承担了其他系统中阴影所起的作用。
- 正文使用 Suisse，技术内容（代码、URL、API 名称、文件路径）使用 Geist Mono，以实现文档与文案之间的明确语义区分。
- 在展示尺寸上收紧字间距（40-52px 时为 -0.005em，60px 时为 -0.01em），在小尺寸上打开（低于 14px 时为 +0.01-0.02em）——绝不使用统一的字间距。
- 保持阴影堆叠为 2-3% 黑色透明度；深度来自分层和环境环（rgb(249,249,249) 0px 0px 0px 6px），绝不用厚重的投影阴影。
建议避免
- 除 #ff4d00 外，不得引入任何色相。绿色、蓝色和紫色在配色中刻意缺席。
- 不要为大面积表面使用填充彩色背景。橙色应仅用于小的交互元素，而非区块背景或首屏填充。
- 按钮或标签不要使用锐角（0-4px 半径）。胶囊形状是核心身份标识。
- 不要使用暗色透明度超过 5% 的阴影。该系统刻意保持扁平——激进的阴影破坏了蓝图感。
- 不要在标题中使用 450 字重。标题使用 500 字重；中间字重仅用于长文本中的正文强调。
- 不要用颜色来表达正文中的层级。层级来自字重（400 与 500）、大小，以及 Slate→Ink 灰度渐变（#727272→#262626）。
- 不要将文字直接放置在点/网格背景上，除非有卡片或表面层——网格线是结构性的，而非文案的背景。
