Symbol Audio

深色基底、衬线字形与网格布局。
页面以深色为基底。字体采用 Chalet-LondonSixty、Chalet-NewYorkSixty。视觉特点包括衬线字形、网格布局、大字排版、大幅摄影展示。适合参考的场景:商品详情页、品牌产品介绍页。
查看原始网站使用规范
建议采用
- 每个区块带使用 #1c3c27 作为画布底色——整个站点都沉浸于这一种颜色之中,区块之间的过渡完全不可见。
- 搭配Chalet衬线字体用于所有正文、导航、价格和标签,搭配SupremeLL-Bold用于所有标题——绝不混用角色。
- 将产品卡片背景设为 #fffffd(霜白),圆角 0px,搭配细线 #dfe2e5 边框——卡片是说明牌,而非瓷砖。
- 为每个徽章、标签和胶囊按钮使用9999px圆角——其他所有地方均保持锐利的边角。
- 将展示标题锚定在左侧边缘,并设置为大字号(52–80px),在 SupremeLL-Bold 字体中使用 -0.02em 字间距。
- 将公告横幅固定在视口底部边缘,填充深绿——它永不滚动消失。
- 正文使用 #000000,卡片使用 #dfe2e5,始终保持 16:1 以上的对比度。
建议避免
- 不要引入填充实色按钮——本系统仅使用空心/透明描边操作。
- 不要使用蓝色(#447cf0)或红色(#c72a00)作为功能 UI 颜色——它们仅作为装饰性摄影元素。
- 不要为产品卡片或首屏图片添加圆角——除徽章和胶囊按钮外,整个系统均保持锐利边缘。
- 不要将正文文本设置为 SupremeLL-Bold——无衬线字体仅用于展示和标题。
- 不要为卡片或图片添加阴影(box-shadow 或 drop-shadow)——表面为平面,对比来自色彩而非层次。
- 不要使用纯 #ffffff 作为表面或文本颜色——系统使用 #fffffd(霜白)和 #dfe2e5(灰铜色)作为最亮的色调。
- 不要破坏横幅的连续性——公告横幅始终存在,始终固定,始终为深绿配灰铜色。