SOFT UI · 陶瓷手感

整块界面,从同一片
陶瓷面板上长出来

没有第二种底色:凸起的浮出来,凹陷的按进去,双向柔光雕出每一个控件。

22.5°客厅 · 制热中

恒温旋钮

外圈凸起、内芯凹陷,紫罗兰弧线只负责指示数值。

46%湿度21设备

风格信息

类别 Mobile 移动端 年代 工具 / 生活方式 复杂度 最适合 智能家居 · 硬件控制 · 健康监测 模式 仅浅色

风格特性

凸起卡片里嵌着凹陷的图标槽——嵌套深度是它的签名。

双向柔光阴影

光从左上来:亮影 -6px 白、暗影 +6px 灰蓝,同一块材质被"挤"出体积。

凸起 ⇄ 凹陷双态

静止时凸起(extruded),按压与输入时翻转为凹陷(inset),物理隐喻贯穿全局。

点到为止的紫罗兰

#6C63FF 只出现在激活、聚焦与指示位,其余全部交给单色陶瓷底。

按钮与控件

按压:缩放 0.97 + 阴影翻转为凹陷,250ms 标准缓动。

全部在线 节能模式

添加新设备

输入槽是凹进面板的,聚焦时亮起 1.5px 紫罗兰描边。

配色板

一种底色、两种光、一抹点缀。

陶瓷底
#E0E5EC
点缀紫
#6C63FF
主文本
#3D4852
次文本
#6B7280
凹陷底
#D1D9E6
暗影
rgba(163,177,198,.7)
亮影
rgba(255,255,255,.6)
主钮渐变
6C63FF→5A50E8

字体级阶

显示级 · Plus Jakarta Sans 800 · 32px · 字距 -0.5

安静的物理感

标题 · Plus Jakarta Sans 700 · 24px

客厅环境总览

正文 · Plus Jakarta Sans 400 · 16px

低对比的材质世界里,文字必须自己足够深,才能稳稳落在陶瓷面板上。

标签 · Plus Jakarta Sans 600 · 12px

TEMP · HUMIDITY · SCENES