Strut 网站预览
Strut 网站预览

Strut

浅橙色基底、大字排版与细线分隔。

页面以浅橙色为基底,搭配深灰色文字。字体采用 GT Pressura Standard、Inter。视觉特点包括大字排版、细线分隔、非对称构图、产品图像展示。适合参考的场景:效率工具官网、协作产品介绍页。

查看原始网站

使用规范

建议采用

  • 每个营销页面分区都以Paper Cream(#ead7b8)作为画布,绝不要退回白色。
  • 展示标题采用GT Pressura 500、68–136px,行高0.92,letter-spacing约为0.071em。
  • 分区开头使用全大写Inter 10–12px微型标签,letter-spacing为0.25em,颜色为Stone(#73706b)。
  • 所有卡片和容器边缘都采用1px的Slate Border(#676460)或Sand Border(#e5dfd5);绝不要用投影表现抬升。
  • 所有工作空间和功能卡片采用28px圆角,应用截图框采用24px,小型交互表面采用8px。
  • 分区之间的纵向呼吸空间放宽至80–120px,以维持印刷跨页的节奏。
  • Amber Honey(#ffb546)保留给品牌标志、激活图标描边和侧栏激活指示;绝不要用它填充按钮或大面积表面。

建议避免

  • 不要使用彩色填充CTA按钮;操作以无填充文字链接或带Deep Stone(#5c5955)边框的描边控件呈现。
  • 正文不要采用展示字重或展示字号;唯一的正文处理是Charcoal(#333333)的Inter 400、14–16px。
  • 不要用投影、辉光或模糊效果抬升卡片;系统刻意保持平面。
  • 页面背景不要使用纯白(#ffffff);Paper Cream是系统画布。
  • Amber Honey(#ffb546)不要用于文字、按钮填充或大面积背景;它只能作为1–4px点缀。
  • 全大写微型标签的letter-spacing不要收紧到0.2em以下;宽字间距使它们具有编辑式页边注的感受。
  • 长正文段落不要居中;正文紧贴左侧,置于640–720px的max-width栏中。