Lottielab
近白色基底、大字排版与紧密字距。
User Interviews
近白色基底、手绘图形与等宽文字标注。
页面以近白色为基底。字体采用 Sofia Pro、P22 Mackinac Pro。视觉特点包括手绘图形、等宽文字标注、胶囊形控件、衬线字形。适合参考的场景：软件产品首页、服务说明页。
查看原始网站使用规范
建议采用
- 使用 #1c5d5f 深青色填充按钮作为唯一主要操作色——每个视口最多一个
- 将深青色主要操作色与藏蓝 #16325a 填充按钮搭配，以在同一页面上提示第二个产品方向
- 标题文字使用 P22 Mackinac Pro 字体，字号范围 44–64px，正常字间距，行高 1.16–1.20 倍
- 所有区块眉题采用IBM Plex Mono大写文字，字号13–14px、字间距0.038–0.059em，并在前方加一个小彩色圆点。
- 所有按钮使用 48px 圆角，导航胶囊按钮使用 1000px 圆角，以体现标志性的圆润几何形态
- 通过 #e4f0f1（薄荷绿）和 #f2e8e2（玫瑰粉）填充卡片表面，绝不使用阴影效果
- 所有插画以 #231e21 为底色线条，辅以选择性的深青色 #65b8a2 和玫瑰色 #d6aec1 填充
建议避免
- 卡片或面板绝不添加阴影效果——系统仅使用扁平色彩分层
- 页面背景绝不使用纯 #ffffff——始终使用 #f2f8f7 以呈现温暖的底色基调
- 除深青、藏蓝及透明描边变体外，绝不引入其他按钮颜色
- 标题绝不使用 Sofia Pro 字体——标题必须使用 P22 Mackinac Pro 衬线字体以保持编辑性身份
- 区块标签不要使用系统字体，眉题必须采用IBM Plex Mono和大写宽字间距。
- 按钮绝不使用尖锐或低圆角——最小圆角为 48px，胶囊形态是标志性特征
- 绝不以摄影替代插画——手绘线条艺术风格是品牌的视觉锚点
