Portal 网站预览
Portal 网站预览

Portal

近黑色基底、细线分隔与网格布局。

页面以近黑色为基底。字体采用 Suisse Intl。视觉特点包括细线分隔、网格布局、大幅图像展示。适合参考的场景:AI 工具官网、产品能力介绍页。

查看原始网站

使用规范

建议采用

  • #b296f8是操作按钮唯一的彩色填充,配#ffffff文字和10px圆角。
  • 展示标题采用Suisse Intl 900、48–72px、-0.025em letter-spacing和1.00–1.11行高;900字重是品牌语气不可更改的要求。
  • 每张卡片都采用紫罗兰色调阴影rgba(178,150,248,0.20) 0px 25px 50px -12px;辉光就是抬升系统,而非普通灰色投影。
  • 徽章家族采用透明填充、1px饱和边框、去饱和粉彩文字、12px字号、0.20em letter-spacing和10px圆角,绿、蓝、紫罗兰和粉四个颜色家族都保持活跃轮换。
  • 卡片、按钮、徽章和导航统一使用唯一10px圆角,不引入次级圆角。
  • 画布保持#000000,抬升表面#0f0f13,边框色调只采用#292929和#1d1d1d。
  • 正文采用0.05em字间距,小标签和徽章0.20em,展示文字收紧至-0.025em;这三个字间距形成有辨识度的节奏。

建议避免

  • 不要引入第二种强调色;品牌是单色深暗加唯一紫罗兰信号。
  • 展示标题不要采用400–600字重;大字号中的900是标志性特征。
  • 卡片不要采用中性灰投影;紫罗兰色调阴影是唯一抬升模式。
  • 圆角不要采用10px之外的数值;系统只有一种圆角,必须保持单一。
  • 不要将浅色文字放在浅色徽章填充上,或深色文字放在深色边框上;徽章模式始终为深色饱和边框加去饱和粉彩文字。
  • 正文不要采用#ffffff;它只留给展示标题和品牌标志,正文使用#e6e6e6。
  • 分区间距不要缩减至48px以下;紧凑却有呼吸感的节奏是身份的一部分。