B—Line 网站预览
B—Line 网站预览

B—Line

白色基底、等宽文字标注与产品图像展示。

页面以白色为基底,搭配近黑色文字。字体采用 HELVMONO、helvetica-bold。视觉特点包括等宽文字标注、产品图像展示、摄影展示、扁平表面。适合参考的场景:设计作品集、创意服务介绍页。

查看原始网站

使用规范

建议采用

  • 所有正文、导航和产品标签文字都采用HELVMONO,或IBM Plex Mono / JetBrains Mono替代字体,字号14px。
  • 调色板严格无彩色,只采用#000000、#ffffff和#595959。
  • 产品卡片图像采用1px solid #000000边框、0px圆角,没有阴影。
  • “B—Line”文字标志以180–240px厚重无衬线字体占据首屏,铺满整个视口宽度。
  • 所有间距以4px为基础单位,元素间隙5–7px、卡片内边距4px、分区间距32px。
  • 产品摄影采用统一中性灰摄影棚背景,以及紧密居中的裁切。
  • 维持满幅布局,没有居中max-width容器,内容从边到边展开。

建议避免

  • 绝不要引入彩色,没有蓝、红、绿或强调色相;系统刻意无彩色。
  • 卡片或表面绝不要采用阴影、抬升或渐变;平面感具有结构意义。
  • 容器圆角绝不要超过4px;设计直线化。
  • HELVMONO正文绝不要高于14px;等宽用于标签,而非长段落。
  • 界面绝不要添加装饰图像、生活方式摄影或背景纹理。
  • 绝不要使用衬线或比例正文字体;等宽就是身份,而非风格选择。
  • 网格行之间绝不要添加分区分隔线、背景浅色调或视觉断点,让网格连续展开。