3D & Hyperrealism · 沉浸纵深

有重量的界面,
触手可及的纵深

八段停靠点的复杂渐变模拟金属与宝石的物理光照,三层递进阴影把元素从深海蓝背景中托举出来,1000px 透视让一切近在眼前。

拟真三要素

超写实不靠贴图,靠光照逻辑:高光、漫反射、投影三者自洽,深度才可信。

多层真实阴影

近、中、远三层 box-shadow 依次加深加宽,复现真实光源下 20%–40% 的暗部衰减。

透视与视差

perspective: 1000px 配合 rotateX 微倾与五层漂浮元素,构建 300–400ms 的顺滑空间运动。

材质与光泽

5–10 个停靠点的径向渐变刻画金、银、宝石的高光与环境反射,细节经得起放大。

按钮与控件

按钮是实体浮雕:悬停抬升 2px,按下沉降 4px,底缘厚度随之变化。

按钮状态
开关与徽标 典藏级材质

表单示例

输入框向内凹陷、按钮向外凸起,一凹一凸构成清晰的触觉层级。

配色板

深海军蓝奠定暗场基调,金与银承担高光,翡翠绿与勃艮第红点缀珍稀材质。

字体级阶

展示层使用 Playfair Display 衬线体呼应奢华质感,正文使用 Inter 保证可读性。

显示级 · Playfair Display 700 · 50px

深度即奢华

标题 · Playfair Display 600 · 28px

光照决定真实感

正文 · Inter 400 · 17px

多层阴影与复杂渐变共同构成可信的物理世界,让界面拥有触感与重量。

标签 · Inter 600 · 13px

Hyperreal / 超写实