WAPER / UI

阴影与边框

四种阴影只在亮色有（暗色全透明，靠底色层级与细边）；tooltip 与悬停卡只有 0.5px 内描边；对话框与设置没有阴影。边四档。

预览

亮色

--shadow-inline

inline

inline：浮起来的控件（成员胶囊、滚到底）

--shadow-control

control

control：输入框

--shadow-card

card

card：1px 边画在阴影里

--shadow-popover

popover：菜单、弹层、toast

--shadow-edge

edge

edge：tooltip、悬停卡（没有投影）

暗色的阴影全部透明，靠底色层级与细边分开；对话框与设置弹窗两套主题都没有阴影。

在 --surface-base 上

--border-primary · 输入框聚焦、勾选框边

--border-secondary · 输入框平时、菜单、对话框

--border-tertiary · 浮起来的控件、卡片

--border-quaternary · 分隔线

--hairline · 侧栏右边线、菜单、tooltip（2× 屏 0.5px）

在 --surface-elevated 上

--border-primary · 输入框聚焦、勾选框边

--border-secondary · 输入框平时、菜单、对话框

--border-tertiary · 浮起来的控件、卡片

--border-quaternary · 分隔线

--hairline · 侧栏右边线、菜单、tooltip（2× 屏 0.5px）

暗色

正在加载预览…