返回文章列表

谈谈深色模式的设计审美

在构建个人博客时,审美是排在功能之后的第一生产力。

核心要素

  1. 色彩深度:避免纯黑 (#000),使用深灰色或带有蓝调的碳黑。
  2. 层次感:利用 backdrop-filter: blur() 实现玻璃拟态效果,打破桌面的扁平化感。
  3. 强调色:选择高饱和度的荧光色作为点缀,例如电光蓝 (#00f2ff)。

“好的设计是看不见的,但你能感受到它的高级感。”

代码示例

.glass-effect {
  background: rgba(255, 255, 255, 0.05);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(255, 255, 255, 0.1);
}