pampam.city
暖白色基底、胶囊形控件与圆角卡片。
Podia
近白色基底、胶囊形控件与紧密字距。
页面以近白色为基底，搭配近黑色文字。字体采用 StabilGrotesk。视觉特点包括胶囊形控件、紧密字距、扁平表面、网格布局。适合参考的场景：软件产品首页、服务说明页。
查看原始网站使用规范
建议采用
- 使用 #06040（墨色）作为所有主要行动号召（CTA）的单一深色填充——一致性是关键；带有紫调的近黑色本身即为品牌信号
- 将三种产品色（天蓝、赭石、薰衣草）作为完整卡片填充，用于表示在线商店、网站和电子邮件营销——它们构成一个固定的联想三角
- 将展示标题设为 60px/700，字间距 -0.03em——在几何无衬线字体上采用紧致的字间距是其标志性特征
- 在任何节标题前，使用 11px 的大写眉标，字间距 0.1em——它们营造出一致的节段节奏
- 为三个产品功能卡片设置 56px 圆角，标准内容卡片为 24px——显著的圆角差异是刻意设计，用于建立视觉层级
- 在首屏和功能区块后方，以 0.6–0.9 不透明度浮动赭石、天蓝、薰衣草和米色的有机团块形状——这些形状是系统最显著的元素
- 所有主要区块使用 80px 垂直内边距，卡片内部使用 36px 内边距——充足的呼吸空间是温暖、从容氛围的核心
建议避免
- 不要引入渐变、发光效果或玻璃态设计——系统刻意保持哑光和平面；色彩调性承担了通常由渐变完成的情感表达
- 不要将纯 #a5c8d8 用作信息/语义色彩——它是品牌辅助色，而非状态指示。语义色彩应仅用于实际状态表示
- 不要使用纯 #000000 作为文字或按钮颜色——#06040 中的紫调才是将深色元素与品牌调性连接的关键
- 正文文字不得大于18px或小于16px——字体层级从18直接跃升至副标题的24；16–18的正文范围是刻意设定的。
- 不要为卡片添加阴影——层级感来自色彩填充和圆角，而非投影阴影。添加阴影会破坏纸艺感的隐喻
- 不要以全透明或前景元素形式使用有机团块形状——它们是背景氛围，不透明度为 0.6–0.9，从不交互
- 不要在单个卡片或按钮上混合使用三种产品颜色——每个产品区域独占一种颜色
