Twingate
近黑色基底、胶囊形控件与大字排版。
GitHub
近黑色基底、渐变展示与磨砂表面。
页面以近黑色为基底，搭配白色文字。局部操作控件以绿色强调。字体采用 Mona Sans、Mona Sans Mono。视觉特点包括渐变展示、磨砂表面、居中构图、网格布局。适合参考的场景：开发者工具官网、API 服务介绍页。
查看原始网站使用规范
建议采用
- 所有填充按钮（绿色 CTA 及轮廓按钮）使用 6px 半径，导航标签与筛选标签使用 60px 胶囊形半径——同一组件类型内禁止混用这两种形状语言
- 正文文本设定为 Mona Sans 16px/400，行高 1.5——这是系统中使用频率最高的字体设置（402 次），定义了阅读节奏
- 将 #08872b 终端绿专用于每屏唯一的主行动号召（CTA）；禁止用于次要操作、标签或装饰元素，否则会削弱其作为终端光标特性的辨识度
- 所有卡片使用 rgba(255,255,255,0.06–0.2) 填充与 1px 边框（rgba(255,255,255,0.1)）——禁止使用不透明背景或阴影；磨砂玻璃效果是卡片的唯一身份特征
- 在 64px 显示字号下应用 -0.035em 字间距，并平滑过渡至 18px 正文时的 0.01em——这一字间距曲线正是让 Mona Sans 产生工程感而非普通感的关键
- 在首屏区域内容后方放置一个径向紫色渐变光环（经 blur(60px) 模糊处理）以营造氛围深度——页面绝不能呈现为纯黑平面
- 使用 Mona Sans Mono 12px/500，大写，字间距 0.015em 用于微标签、导航标签及代码相邻的元数据——为原本平淡的标签注入技术可信度
建议避免
- 特征卡片禁止使用 4px 或 8px 半径——24px 半径才是让卡片呈现为 GitHub 玻璃面板的正确尺寸；更小的半径会使其看起来像表单字段
- 禁止将蓝色作为主要操作颜色——GitHub 的 CTA 为温暖的绿色 #08872b，这是对 SaaS 领域蓝色惯例的明确拒绝
- 禁止在卡片或按钮上使用阴影——层级感通过透明度和模糊实现，绝不能通过阴影堆叠表达
- 正文文本的字号禁止低于 16px 或高于 18px 用于段落内容——字体层级在可读范围内刻意保持狭窄
- 禁止在按钮或大区域使用纯紫色或紫色填充——紫色仅作为卡片边框辅助色（#8c93fb）或渐变光环内部出现，绝不能作为纯背景使用
- 禁止将显示字重 425 与常规 700 加粗混用——425 字重是 Mona Sans 的可变轴最佳平衡点，轻于加粗但比常规更显存在感
- 禁止在通用链接文本或图标中使用 #1f6feb 青钴色——该色仅用于低频次的品牌展示场景；常规链接或辅助文本使用 #8dd6ff 天蓝
