Browserbase 网站预览
Browserbase 网站预览

Browserbase

白色基底、等宽文字标注与胶囊形控件。

页面以白色为基底,搭配近黑色文字。字体采用 plain、gtPlanar。视觉特点包括等宽文字标注、胶囊形控件、分屏构图、居中构图。适合参考的场景:开发者工具官网、API 服务介绍页。

查看原始网站

使用规范

建议采用

  • 每个主要操作按钮都采用#000000填充和50px border-radius;黑色胶囊是唯一的操作表面。
  • 任一标题中的一个关键短语,用#ff4500橘色强调框包住,字号和字重与周围文字相同。
  • 所有gtPlanar文字都应用“ss05” font-feature-settings;替代字形组是品牌的排版身份。
  • 功能卡片表面使用#e2e9f3 lavender-mist,标志条带卡片使用#f8fafc faint-slate,在没有分隔线的情况下建立分组。
  • gtPlanar展示标题采用-0.02em至-0.05em letter-spacing,字号越大越紧密;负字间距使标题具有编辑式感受。
  • 分区元数据、眉题和统计标签采用gtStandardMono 14px、0.06em letter-spacing和全大写。
  • 界面保持95%+单色;唯一橘色是强调工具,而非表面色。

建议避免

  • 绝不要将#ff4500作为按钮背景、边框或悬停状态;它只是排版强调色。
  • 绝不要用box-shadow抬升卡片;通过表面色对比和1px边框传达深度。
  • 正文绝不要使用几何或展示字体;plain或Inter替代字体,是24px以下唯一的UI字体。
  • 按钮绝不要采用完全圆润的999px圆角;50px胶囊具有特定的中等分量,而非完整胶囊。
  • 正文绝不要使用彩色文字;文字只能为#000000或#686562。
  • 同一标题绝不要放置多个橘色强调框;每行只强调一个短语。
  • 绝不要使用#0000ee或浏览器默认链接蓝;链接样式是带下划线的#000000。