Voiceflow
白色基底、胶囊形控件与细线分隔。
Webflow
白色基底、产品图像展示与紧密字距。
页面以白色为基底，搭配近黑色文字。字体采用 WF Visual Sans Variable、WF Visual Sans Mono。视觉特点包括产品图像展示、紧密字距、居中构图、单栏阅读排版。适合参考的场景：设计产品官网、作品展示页。
查看原始网站使用规范
建议采用
- 使用 #146ef5 专用于填充型主要操作、激活导航状态和链接强调——它是唯一承载交互重量的颜色。
- 将标题设为 56–80px，使用 WF Visual Sans Variable 字重 600，字间距 -0.01em；正是这种紧凑的字间距，使显示字体呈现出建筑感，而非装饰性。
- 卡片、图片和大容器使用 8px 边距圆角；按钮、输入框和标签使用 4px。禁止使用完全圆润的胶囊形按钮（1440px 仅出现一次且为异常情况）。
- 将 #080808 字体置于 #ffffff 背景上，对比度达到 20:1——该系统以最大可读性为设计目标，而非温暖感。
- 使用 1px #d8d8d8 边框在静止状态下定义结构；仅在悬停或浏览器边框模拟时使用阴影。
- 将区块垂直间距设为 80px，卡片内边距设为 24px；以 4px 基础单位递推，形成宽裕的留白，同时避免空旷浪费。
- 通过真实的浏览器边框展示产品，而非抽象插图——‘Webflow 内嵌 Webflow’的自指式演示是标志性手法。
建议避免
- 不要在 UI 中引入额外的彩色——绿色（#60ed76）和橙色（#ffa666）仅为装饰用途，仅限于内联插图中出现。
- 不要为主要操作使用完全圆润的胶囊形按钮；4px 圆角代表专业工具的定位，必须避免扩展至 9999px。
- 不要为静止状态的卡片添加阴影；该系统以边框定义结构，仅将阴影作为交互反馈使用。
- 不要将显示标题设得低于 40px，或在首屏内容中使用 400 字重；56–80px 字重 600 的宏伟感是品牌的字体标志。
- 不要在系统中混用衬线字体或展示字体——WF Visual Sans Variable 是唯一被允许用于界面文本的字体。
- 不要在单个标题区块中使用多个字体尺寸；尺寸层级清晰递进，层级结构应遵循字体尺度，而非任意尺寸。
- 不要将品牌蓝置于深色背景上用于悬停或激活状态；仅在浅色背景上使用 #146ef5，且在深色背景上强调时使用白色或 #146ef2。
