MANNA 网站预览
MANNA 网站预览

MANNA

暖白色基底、大幅摄影展示与大字排版。

页面以暖白色为基底。字体采用 Scto Grotesk A、Merlo。视觉特点包括大幅摄影展示、大字排版、细线分隔、满幅色块。适合参考的场景:设计工作室首页、案例展示页。

查看原始网站

使用规范

建议采用

  • 每张图像、每个容器和表面都采用0px border-radius;这是一套编辑式系统,而非产品UI。
  • 每张照片都以1px solid #000000细线边框框住。
  • 展示文字设为Scto Grotesk A 500字重、60px,锚定视口左侧或右侧边缘,作为导向标记。
  • 所有图片说明都采用Merlo 14px,与图像底部间隔10px。
  • #af6446锈色只用于满幅分区背景,绝不要作为按钮填充、徽章或图标着色。
  • 保持舒适密度:元素之间12-20px间隙,主要分区之间60px。
  • 让摄影成为内容,避免装饰叠加层、渐变或包裹图像的卡片。

建议避免

  • 任何元素都不要引入圆角;0px圆角是编辑式感受不可更改的要求。
  • 不要将#af6446作为CTA或按钮背景;它是分区面板色,而非操作色。
  • 不要添加投影、抬升或z轴深度;表面是平面。
  • 同一分区中不要混用超过两种字号;系统采用14px低语和60px高喊。
  • 展示文字不要添加letter-spacing、text-transform或font-feature装饰;它以默认grotesk比例表达。
  • 图标或UI元素不要用锈色填充;它只属于满幅背景。
  • 不要添加导航按钮、汉堡菜单或叠加UI;页面本身就是导航。