Atoms

烛光中的黑曜石巨碑:近黑画布上,唯一暖香槟强调像刀刃一样划过黑暗。
Atoms 遵循近乎完全单色的纪律:纯黑画布承载暖奶油文字和唯一香槟强调。系统避免将颜色作为装饰,而通过紧凑色彩尺度营造氛围:奶油色用于文字,金色用于强调,黑色用于纵深;这种工业精度感像钨丝灯下经过机械加工的钛。布局紧凑,以文字和网格驱动,包括大型几何标志、居中标题叠放,以及用极少框架承载公司信息的深色边框卡片。组件平面、低对比,通过细线边框而非阴影定义。动感由结构暗示,而非动画;每个元素都像被安放在那里,而不是正在运动。
查看原始网站使用规范
建议采用
- 黑色表面上的所有主要文字和细线边框,都使用 #fff7dd。
- #c8ad86 仅用于类别标签、强调标题和装饰边框,绝不作为整片表面的填充。
- 所有展示字号都使用 Switzer 和紧密负字间距:44px 时为 -1.85px,16px 时为 -0.13px。
- 卡片和按钮圆角设为 4px;100px 只用于标签和胶囊。
- 卡片和区块通过 1px 细线边框区分,绝不通过阴影或背景填充。
- 垂直节奏保持紧密:相关元素之间为 8-16px,主要区块之间为 80px。
- 所有图标和箭头都以 #fff7dd 或 #c8ad86 呈现,绝不引入其他颜色。
建议避免
- 不要用阴影、发光或模糊效果营造悬浮层次,只通过边框定义表面。
- 不要引入香槟强调之外的高饱和色,不使用蓝、绿或红。
- 文字不要使用纯白 #ffffff。#fff7dd 更温暖,也更符合品牌。
- 卡片或区块不要添加背景填充,它们直接置于黑色画布上。
- 卡片不要使用 12px、16px、24px 等大圆角。矩形圆角最大保持 4px。
- 正文不要设置字间距,只有 16px+ 字号才保持紧密字间距。
- 加载时不要让颜色、位置或尺度产生动画。系统静态、像被安放,而非动态运动。