Delphi 网站预览
Delphi 网站预览

Delphi

暖白色基底、细线分隔与宽松留白。

页面以暖白色为基底,搭配近黑色文字。字体采用 Martina Plantijn Light、Inter。视觉特点包括细线分隔、宽松留白、扁平表面、衬线字形。适合参考的场景:AI 工具官网、产品能力介绍页。

查看原始网站

使用规范

建议采用

  • 所有区块和首屏标题使用 Martina Plantijn Light 300 字重,字间距 -0.022em —— 这种轻如耳语的衬线字体是品牌的编辑签名。
  • 主行动号召按钮(CTA)使用深巧克力色(#3e2407)填充,搭配桃色(#fed0b3)光晕阴影;绝不使用传统蓝色或绿色作为行动按钮填充色。
  • 页面背景保持羊皮纸色(#fdf6ee);仅当卡片需要从底布中突出时,才切换为纯白卡(#ffffff)。
  • 按钮使用 12px 圆角,承载图像的卡片使用 16px 圆角——仅在头像圆圈上使用 70px 圆角,其他形状绝不使用。
  • 仅在视口内保留一次或两次的强调时刻使用姜黄(#ff5c00)和 余烬 橙(#f65726)——绝不用于大面积填充或背景。
  • 首屏设计为围绕中心衬线标题散落的白色问题卡片构成的星群状布局;禁止使用单一的首屏插图。
  • 每个区块以位于两行衬线标题上方的居中眉题标签锚定,下方只有一段短文,不再增加。

建议避免

  • 绝不使用明亮的蓝色、绿色或任何冷色调作为主行动号召按钮填充色——本系统中唯一的按钮填充色为深巧克力棕色。
  • 绝不给卡片添加厚重的投影阴影;设计采用扁平表面和细线边框,而非层级堆叠。
  • 绝不将正文置于衬线字体中——正文部分由 Inter 承担,20px 以下全部使用 Inter,仅在展示场景下使用 Martina Plantijn。
  • 绝不将纯黑色(#000000)用于奶油底色上的正文——眼睛会感觉过于冰冷;应使用褐棕(#2b180a)或炭木(#21201c)替代。黑色仅用于导航文字和图标笔画。
  • 绝不为卡片或按钮添加渐变——页面整体为扁平设计,唯一例外是肖像面板和桃色按钮的光晕。
  • 每个区块内最多使用两种文本颜色(一个标题色调,一个正文色调);温暖感来自色彩调性的克制使用,而非色彩变化。
  • 绝不超出 4px、8px、12px、16px 和 70px 的圆角值范围——圆角值体系有意识地保持简洁。