Home

白色基底、衬线字形与胶囊形控件。
页面以白色为基底,搭配近黑色文字。字体采用 TWK Lausanne、PP Mondwest。视觉特点包括衬线字形、胶囊形控件、大字排版、宽松留白。适合参考的场景:支付服务首页、金融科技产品介绍页。
查看原始网站使用规范
建议采用
- 首屏标题使用 PP Mondwest,字重 400、字号 165–295px,lineHeight 为 0.9,letterSpacing 为 -0.04em;紧致的字间距是文字具有印刷油墨质感的关键。
- 主要操作按钮使用 #2bee4b 填充色 + #93b799 绿色调阴影;切勿在强调按钮上使用灰色阴影
- 为每张摄影素材应用 grayscale + hue-rotate(80deg) 滤镜,使所有图像与页面保持同一色调体系。
- 保持画布背景为 #fafffa(温暖的骨白)——切勿使用纯 #ffffff,这种暖调是区别于普通 SaaS 面板的关键
- 使用 TWK Lausanne 11px / 550 大写,字间距 +0.01em,用于所有微标签、导航项和按钮——微字体在这里承担了 界面外围元素 的功能
- 将编辑类照片插图(半径 14px)浮动于显示文字行之间,而非以网格形式排列,呼应印刷排版
- 在页脚前以满幅 #2bee4b 条带作为页面的锚点,其功能相当于最终签名
建议避免
- 切勿引入第二个饱和强调色——页面整体为单色,仅以绿色为唯一色彩元素
- 切勿在主要操作按钮上使用圆润的胶囊形状(9999px);5px 保持其锐利与矩形,契合编辑风格
- 切勿将正文文字字号设得大于 18px——设计依赖于 18px 正文与 96px 以上显示文字之间的尺寸差异来营造节奏感
- 切勿在卡片或内容区块上使用 box-shadow;层级感仅存在于绿色按钮上
- 切勿以全彩呈现照片——所有照片必须经过灰度转绿调过滤才能属于该系统
- 展示标题不要使用无衬线字体;Mondwest 与 Editorial New 的对比赋予页面编辑版面的声音。
- 内容宽度切勿超过 1400px——超大字号与宽敞画布共同营造出报纸般的视觉感受