Your workplace has the answer. Just ask Dala for it. 网站预览
Your workplace has the answer. Just ask Dala for it. 网站预览

Your workplace has the answer. Just ask Dala for it.

近黑色基底、分屏构图与胶囊形控件。

页面以近黑色为基底,搭配灰色文字。字体采用 Neue Montreal。视觉特点包括分屏构图、胶囊形控件、大字排版、紧密字距。适合参考的场景:AI 工具官网、产品能力介绍页。

查看原始网站

使用规范

建议采用

  • 仅使用 #8052ff(电光紫)作为填充型操作按钮的颜色——其他饱和色不得作为按钮背景出现
  • 所有标题均设为 400 字重,绝不使用粗体——Dala 通过尺寸(78–113px)和字间距(-0.04em)实现层级感,而非字重
  • 18px 正文使用 PPNeueMontreal 200 字重——超轻字重是标志性特征,不得用 400 字重替代
  • 每个区块背景必须保持纯 #000000 黑色——禁止使用深灰色面板或卡片表面;虚空即设计
  • 在所有 42px 及以上显示尺寸上应用 -0.04em 字间距,113px 时约等于 -4.52px
  • 按钮、卡片和导航元素统一使用 24px 圆角半径——作为一致的圆角令牌;仅在极小尺寸下呈现胶囊形状
  • 让粒子星群成为唯一的首屏视觉元素——禁止在首屏区域引入摄影、插画或产品截图

建议避免

  • 禁止在大背景块或完整区块中使用填充紫罗兰色(#8052ff)——该色仅用于按钮和强调,不作为表面颜色
  • 禁止将正文设为 400 字重——Dala 的标志性超轻(200)正文是阅读体验的区分特征
  • 禁止引入带有边框、阴影或背景填充的卡片容器——元素仅悬浮于黑色背景之上,仅以空白间距存在
  • 禁止使用颜色 #0000ee(默认浏览器链接蓝)——永不指定该色;链接应使用 #ffb829 琥珀色或 #ffffff
  • 禁止在 UI 组件中使用渐变——Dala 的配色为扁平化;渐变仅存在于标志和粒子可视化中
  • 禁止在 PPNeueMontreal 等效几何结构关键时使用系统字体替代——可使用 Inter 作为后备,但必须保留 200 字重正文和 400 字重标题的惯例
  • 禁止在视图中将多个填充按钮放置于相近位置——紫色胶囊按钮仅用于每个视图中的单一主要操作