概览
为什么不用纯黑
纯黑(#000000)在 OLED 屏上会让文字边缘产生光晕(halation),长时间阅读眼睛更累。
Dark Speed 用 #09090B(近黑但保留一点色温),配合 #F4F4F5 的冷白文字,对比度接近 18:1——远高于 WCAG AAA 要求的 7:1,但不会刺眼。
三个关键决策
点阵而非网格
网格线在深色底上会形成明显的「表格感」,把内容切成小块。点阵(radial-gradient 1px 圆点)只提供质感,不产生结构暗示。
卡片不投阴影
深色背景上,阴影几乎不可见,只会让边缘发灰。改成 1px 描边 + 轻微磨砂(blur 8px / opacity 72%),层次反而更清楚。
hover 用「微放大」而不是「上浮」
上浮(translateY)在深色背景下视觉反馈很弱。scale(1.02) 的改变量更明显,也和「卡片浮起来」的心理预期一致。
性能说明
磨砂效果会创建独立合成层。这套主题只给卡片加,且全站卡片数量有限(首屏通常 < 20 个),实测滚动帧率稳定在 60fps。
如果你的站点卡片极多,建议在后台把「卡片模糊」调到 0,即可完全关闭该属性。