Vanmoof 网站预览
Vanmoof 网站预览

Vanmoof

电影感单色展厅。

Vanmoof 遵循激进的单色纪律:黑、白、灰系统中,唯一视觉强音来自 280px 产品字母排版与满幅深色产品摄影。界面本身几乎不可见:1px 的 #e5e7eb 细边框、幽灵控件、无强调色、无装饰渐变、无品牌填充。页面在深色电影感首屏面板与白色编辑区块之间交替,首屏中产品本身就是色彩,白区块则使用安静的 4 列功能网格。每个界面外框决定都优先留白和排版自信,而非界面密度。组件像雕塑旁的博物馆标签,而不是软件仪表盘。按钮 2px、卡片 8px 圆角使几何利落且具有建筑感,强化高端工业产品语言,而非消费应用的柔软。

查看原始网站

使用规范

建议采用

  • 所有首屏产品名使用 280px 的 Unica77LLWeb,字重 700,颜色 #ffffff;这是最易识别的唯一排版标志。
  • 按钮和导航圆角 2px,卡片和链接 8px,9999px 只用于 VANMOOF 标志胶囊;几何利落是刻意的,而不是随意的默认圆角。
  • 基础间距单位保持 8px;所有内边距、外边距和间隙取 4px 的倍数。
  • 所有图标使用 #222222 的 1.5px 描边线稿,不用填充图标、多色图标或表情式象形图。
  • 所有结构分割线和边框使用 #e5e7eb,边框绝不粗于 1px。
  • 让产品摄影提供首屏所有色彩和氛围;界面外框绝不添加背景色调、覆盖层或渐变。
  • 内容区域的区块条带在 #ffffff 与 #f7f7f7 间交替,不用边框也能建立节奏。

建议避免

  • 界面系统不要引入任何红、蓝、绿、紫彩色;单色纪律本身就是品牌身份。
  • 卡片或按钮不要使用投影、浮起或模糊效果;只用平面表面,以留白与细线分隔。
  • 首屏文字不要居中;产品名始终锚在左侧,辅助文字在右侧,形成编辑张力。
  • 正文字号不要低于 14px 或高于 18px;展示文字不要低于 80px,280px 首屏档位除外。
  • 圆角只用控件 2px、容器 8px、标志胶囊 9999px,不用 4px、6px、12px、16px 或 24px。
  • 白色内容区块不要添加背景色、图案或装饰图形;产品与排版承载视觉重量。
  • Gold Award 徽章色 #FFD700 或类似颜色不要作为品牌强调;它是第三方资质,不是设计系统 Token。