Atoms

近黑色基底、居中构图与大字排版。
页面以近黑色为基底,搭配暖白色文字。字体采用 Switzer、system-ui sans-serif。视觉特点包括居中构图、大字排版、细线分隔、扁平表面。适合参考的场景:AI 服务首页、产品演示介绍页。
查看原始网站使用规范
建议采用
- 黑色表面上的所有主要文字和细线边框,都使用 #fff7dd。
- #c8ad86 仅用于类别标签、强调标题和装饰边框,绝不作为整片表面的填充。
- 所有展示字号都使用 Switzer 和紧密负字间距:44px 时为 -1.85px,16px 时为 -0.13px。
- 卡片和按钮圆角设为 4px;100px 只用于标签和胶囊。
- 卡片和区块通过 1px 细线边框区分,绝不通过阴影或背景填充。
- 垂直节奏保持紧密:相关元素之间为 8-16px,主要区块之间为 80px。
- 所有图标和箭头都以 #fff7dd 或 #c8ad86 呈现,绝不引入其他颜色。
建议避免
- 不要用阴影、发光或模糊效果营造悬浮层次,只通过边框定义表面。
- 不要引入香槟强调之外的高饱和色,不使用蓝、绿或红。
- 文字不要使用纯白 #ffffff。#fff7dd 更温暖,也更符合品牌。
- 卡片或区块不要添加背景填充,它们直接置于黑色画布上。
- 卡片不要使用 12px、16px、24px 等大圆角。矩形圆角最大保持 4px。
- 正文不要设置字间距,只有 16px+ 字号才保持紧密字间距。
- 加载时不要让颜色、位置或尺度产生动画。系统静态、像被安放,而非动态运动。