Sing-sing 网站预览
Sing-sing 网站预览

Sing-sing

橙色基底、大幅摄影展示与渐变展示。

页面以橙色为基底,搭配近黑色文字。字体采用 untitledsans、signifier。视觉特点包括大幅摄影展示、渐变展示、紧密字距、衬线字形。适合参考的场景:创意机构官网、项目作品集。

查看原始网站

使用规范

建议采用

  • 使用 #fcd579 作为唯一页面背景——绝不引入白色或灰色画布
  • 让显示字体达到 147px 且字间距为 -0.025em;在小字号时的克制是实现尺度对比的关键
  • 仅将青绿色(#81d6b9)用作细的水平线条、单下划线和渐变笔触——绝不可作为填充或块状色块
  • 需要体现结构感的分隔线,使用由青色到黄色的 linear-gradient(90deg, #81d6b9 40%, #efcb75 100%)。
  • 所有圆角均保持 0px——锐利边缘是编辑语言的一部分
  • 让摄影内容完整填满容器,边缘到边缘,采用原始裁切,不进行圆角或遮罩处理
  • 在所有 untitledsans 和 signifier 字体文本上激活 "kern" 以应对极端的排版范围

建议避免

  • 绝不引入阴影、卡片或浮层——该系统本质上是扁平的
  • 绝不添加白色、灰色或米白色背景;姜黄是唯一的画布
  • 绝不将青绿色(#81d6b9)用作按钮填充或大面积色块——它仅作为线条/笔触强调
  • 绝不为任何元素添加圆角;美学是建筑感且锐利的
  • 绝不使用多种强调色;该系统仅包含两种色彩(青绿+黄色)搭配黑色墨水
  • 绝不为文字或图片添加装饰性边框、方框或容器
  • 绝不使用传统网格卡片系统——布局是艺术导向的,而非模块化