Twingate
近黑色基底、胶囊形控件与大字排版。
Tuple
近白色基底、等宽文字标注与产品图像展示。
页面以近白色为基底，搭配深灰色文字。字体采用 Inter Variable、DM Mono。视觉特点包括等宽文字标注、产品图像展示、宽松留白、扁平表面。适合参考的场景：开发者工具官网、API 服务介绍页。
查看原始网站使用规范
建议采用
- #6a5ed9只用于主要CTA，绝不要改用于图标、标题或装饰；它的稀少使它具有操作感。
- 所有正文、导航、按钮和标题文字都采用Inter Variable；DM Mono严格保留给全大写眉题、技术标签和微文案。
- 按钮和卡片采用12px圆角，输入框和导航项采用8px；9999px只用于真正的胶囊标签和状态徽章。
- 首屏标题设为48–60px、700字重和Zinc 900；将标题、副标题和CTA纵向居中，上下保留宽松的64–96px分区间距。
- 每个分区都配一个DM Mono全大写眉题，使用绿、蓝或橘色品牌强调色；这是传达开发者工具可信度的标志性手法。
- 浅色分区以#fafafa画布、#ffffff卡片表面和#e4e4e7细线边框为基础；没有结构作用时，不要引入新的背景色。
- 深色横带（#18181b）克制使用，每页一次，通过对比让周围浅色分区显得更明亮。
- 生成新组件时，引用本规范中的精确设计变量值，包括颜色、圆角和间距；不要估算或插值。
建议避免
- 不要将#3f71d4、#db5434、#1bb152或其他品牌强调色作为按钮填充；它们用于装饰，而非操作。
- 标准卡片不要使用厚重投影；采用1px边框和细微的0 1px 3px阴影，0 25px 50px阴影只保留给首屏级抬升。
- 同一句子或标签中不要混用Inter与DM Mono；DM Mono只用于独立标签和眉题。
- 正文或功能描述不要居中；正文保持左对齐以便阅读，居中只留给首屏和分区引言。
- 不要引入紫罗兰、蓝、橘、绿四种品牌配色之外的新强调色。
- 在浅色背景上，如果#71717a次级文字已足够，就不要将#27272a用于装饰性文字；Zinc 800保留给标题和主要文案。
- 同一视图中不要叠用多个彩色渐变；每个分区最多一个渐变或色洗。
- 按钮、输入框和卡片等功能性组件的border-radius不要超过12px；16–24px只应出现在超大功能卡片或装饰框架上。
