Amplemarket 网站预览
Amplemarket 网站预览

Amplemarket

白色基底、紧密字距与居中构图。

页面以白色为基底,搭配近黑色文字。字体采用 Labil Grotesk Variable。视觉特点包括紧密字距、居中构图、视频展示、网格布局。适合参考的场景:软件产品首页、服务说明页。

查看原始网站

使用规范

建议采用

  • 在标题大小不超过56px时,使用Labil Grotesk Variable字重400——大尺寸的克制是其标志性特征
  • 仅在海报或展示场景中使用84px全大写字重900,不用于常规板块标题
  • 将柔和粉彩配色(花瓣粉、薄荷绿、柠檬黄、淡紫罗兰)作为扁平卡片填充,用于类别区分——绝不可作为装饰或渐变使用
  • 按钮设置圆角半径为8px,卡片为12px——这两个数值定义了整个设计的形状语言
  • 使用#111111(油墨色)作为主要操作按钮,使用#272625(炭黑)作为深色背景
  • 负字间距与字号成比例:56px 时为 -0.05em;随着字号减小,到正文时字间距为 0。
  • 交替使用浅色区域(#ffffff / #f6f5f3)与深色面板(#272625 / #10054d)以形成视觉节奏

建议避免

  • 大标题不要使用字重500或700——44–56px字重400是标志性选择,而非600–700
  • 不要在柔和配色的类别卡片上添加阴影——扁平色彩本身就是视觉提升
  • 不要将柔和配色用作渐变——它们是用于分类编码的纯色填充
  • 不要在卡片上设置超过12px的圆角,或在按钮上设置低于8px的圆角——系统严格使用这两个数值
  • 不要使用#000000纯黑色作为文字——#111111(油墨色)是主要文字颜色,带有微妙的暖感
  • 不要在白色背景的卡片上添加投影阴影——改用1px边框或细线内嵌代替
  • 不要在深色区域使用颜色进行装饰——仅保留凤凰橙色用于首屏渐变起点和品牌展示场景