San Rita 网站预览
San Rita 网站预览

San Rita

明暗对比、大幅摄影展示与大字排版。

页面兼有浅色与深色区域。字体采用 F37stout、mono。视觉特点包括大幅摄影展示、大字排版、扁平表面、网格布局。适合参考的场景:商品详情页、品牌产品介绍页。

查看原始网站

使用规范

建议采用

  • F37stout仅用于展示场景,让366px标题占据视口,绝不缩小至40px以下。
  • 所有展示文字设为Highlighter Mint(#e2ffcc),并让它与摄影背景重叠。
  • 所有F37stout文字行高保持0.90,极端紧凑感是标志性特征。
  • 所有UI、正文和说明文字采用mono等宽字体或系统等宽替代字体,字号10/12/16px,字间距-0.01em。
  • 区块间隔设为67–70px,元素间隔24px,节奏来自放大的6px基础单位。
  • 在Carbon Ink(#161b13)背景上散落不同角度的倾斜照片卡片,旋转范围-12°至+12°。
  • 所有组件圆角保持0px,角落锐利,设计语言像地形图一样利落。

建议避免

  • 按钮、卡片或图片不要添加圆角,锐利角落必须遵守。
  • 不要使用第二种彩色强调,Highlighter Mint是唯一承担品牌的彩色场景。
  • F37stout不要采用中间字号16–36px,它只在展示尺度或副标题尺度40–48px中成立。
  • 正文不要使用Times,它仅作链接强调,系统其余部分均为mono等宽字体。
  • 不要应用阴影或高度效果,表面仅通过颜色与摄影叠层定义。
  • 正文不要居中,mono等宽UI文案应左对齐或右对齐,绝不居中。
  • 不要引入第三种中性色,五色色阶(#dde2e4 → #84907f → #2d3329 → #161b13 → #000000)就是完整明暗范围。