WHOOP
白色基底、胶囊形控件与圆角卡片。
amp
白色基底、大字排版与紧密字距。
页面以白色为基底，搭配近黑色文字。字体采用 PublicaSans。视觉特点包括大字排版、紧密字距、细线分隔、宽松留白。适合参考的场景：品牌电商首页、商品展示页。
查看原始网站使用规范
建议采用
- #ff6105 只用于主要 CTA 填充、激活步骤徽章、强调线和关键品牌描边，绝不用作正文或大面积背景铺色。
- 展示标题使用 48-78px、字重 300，字间距为 -0.030em 至 -0.036em。这是系统标志性的编辑展示。
- 主要 CTA 圆角为 50px，次要按钮为 24px，卡片为 5px。5 / 8 / 24 / 32 / 50 的圆角阶梯定义组件层级。
- 双层阴影叠层，即橙色辉光加中性 1px 抬升，只应用于主要 CTA。其他元素都不应具有悬浮效果。
- 表面阶梯按 #ffffff → #f3f4f3 → #e5e7eb → #ffdfcd → #202120 排列。每一级都应像有意抬升，而不是简单改变色调。
- 正文使用 PublicaSans，字号为 16px，字重为 400，行高为 1.5，字间距为 -0.01em；字重 500 只留给按钮、步骤标题和短标签。
- 编辑标题下方放置 2-3px 的 #ff6105 强调线，宽度约为标题的三分之一。这是品牌的视觉标点。
建议避免
- 不要引入第二种强调色或辅助品牌色相。系统由单色加一种橙色构成，任何彩色补充都会破坏其节制。
- PublicaSans 不要使用字重 600 或 700。系统上限为 500，更重字重不属于字体尺度。
- 卡片、图像或非主要按钮不要使用阴影。默认采用平面表面加细线边框；悬浮效果是一项特权，而不是默认值。
- 除主要 CTA 和输入框外，任何元素都不要使用 50px 圆角。次要按钮上限为 24px，卡片为 5px。
- 展示文字不要使用全大写或正字间距。字号增大时，字间距只会收紧，绝不放宽。
- 不要用 #ff6105 填满大型区域。橙色是标点，应点缀，而不是涂满。
- 同一页面不要混合圆角与方角系统。只能从 5 / 8 / 24 / 32 / 50 阶梯中选择，并始终遵守。
