用纯 CSS 写一个像素风博客主题

像素风的视觉密码其实很简单：硬边框 + 偏移阴影 + 像素字体。掌握这三样，纯 CSS 就能做出复古游戏 UI。

核心三件套

• 硬边框：border: 3px solid，圆角全部为 0
• 偏移阴影：box-shadow: 4px 4px 0 #000，不带模糊
• 像素字体：Press Start 2P + 中文像素字体回退

代码示例

.btn {
  border: 3px solid var(--ink);
  box-shadow: 4px 4px 0 var(--shadow);
}

按下时把阴影清零、位移补上，就是经典的"按下"反馈。

这套设计系统已用在本站，欢迎查看源码。