The online bank

近白色基底、细线分隔与居中构图。
页面以近白色为基底,搭配近黑色文字。字体采用 N26、N26-Extended。视觉特点包括细线分隔、居中构图、宽松留白、满幅色块。适合参考的场景:金融产品官网、财务服务介绍页。
查看原始网站使用规范
建议采用
- 使用 #088177 深青色填充主要操作按钮和满幅品牌区域——这是系统中唯一被授权主导屏幕的色彩。
- 所有页面背景设为 #faf8f5 画布暖感;仅将 #ffffff 保留用于需要从画布中突出的卡片表面。
- 在 44–80px 字号范围内使用 N26-Extended,行高为 1.10–1.25,用于展示性标题;其宽体特性需要足够尺寸才能正确阅读。
- 按钮和交互控件使用 8px 圆角;图像卡片和大媒体内容保留 24px 圆角。
- 保持区块间距在 64–80px 之间,以维持从首屏到内容过渡中那种宽敞、从容的节奏感。
- 所有细线边框和分隔线使用 #e9e9e9,且在温暖的画布上绝不超过 1px 的粗细。
- 在所有 24px 及以下字号的 N26 文字中应用轻微正向字间距(0.008–0.019em),以在小字号下实现视觉平衡。
建议避免
- 绝不引入额外的强调色——整个系统仅基于墨迹、白色和一种青色运行。增加第二种色彩会破坏品牌一致性。
- 正文内容绝不使用 #000000 黑色——始终使用 #1b1b1b 墨迹,以在温暖画布上实现更柔和的对比。
- 绝不将 N26-Extended 用于正文或 UI 微文本——它仅作为显示字体存在,且在小于 24px 时会失去可读性。
- 绝不使用阴影实现层级感——N26 仅通过背景色对比(#faf8f5 → #ffffff → 淡化表面)实现分层。
- 正文内容绝不小于 14px——字体层级从 11px 开始,仅用于法律条款或说明文字。
- 按钮的圆角绝不大于 8px,品牌主图的圆角绝不小于 24px——圆角尺度是刻意且狭窄的。
- 绝不将彩色按钮置于青色首屏区域——始终在品牌色背景上使用白色反色按钮,以维持反色关系。