Dub Links

近白色基底、胶囊形控件与渐变展示。
页面以近白色为基底。字体采用 Satoshi、Inter。视觉特点包括胶囊形控件、渐变展示、细线分隔、宽松留白。适合参考的场景:SaaS 产品官网、功能介绍页。
查看原始网站使用规范
建议采用
- 所有矩形按钮和输入框使用 8px 圆角,标签和导航 CTA 使用 9999px 圆角
- 导航项、按钮文字及细微强调部分使用 Inter 500 字重;保留 600-700 字重用于小标题
- 使用 Satoshi 500 字重、40-48px 字号用于章节标题展示——绝不低于 40px
- 将 Ink Black(#0a0a0a)作为主要 CTA 与 Ember Orange(#ea580c)作为产品内操作进行配对,明确主次关系
- 使用 Geist Mono 用于短 URL、点击数及任何技术数据展示
- 保持章节间距在 80px 以上,以维持空旷、舒展的节奏
- 所有分隔线和输入框静止状态使用 1px 细线 Mist(#e5e5e5)边框
建议避免
- 单个页面内每个操作使用 Ember Orange(#ea580c)不得超过一次——过度使用会削弱其影响力
- 不要使用厚重的阴影——系统仅使用轻柔的 1-6px 抬升效果
- 不要将 Satoshi 用于正文或 UI 标签——它仅限于 40px 及以上显示用途
- 不要给卡片添加实色背景填充;表面只能保持白色或浅淡染色。
- 不要为主要 CTA 或功能卡片使用 4px 圆角——显著元素的最小圆角应为 8px 和 12px
- 不要引入新的色彩——色彩体系为单色 + 橙色 + 蓝色辅助色
- 不要在产品表面使用装饰性渐变——暖色渐变仅限首屏区域氛围使用