Command Prompt - setobox.boot

Microsoft Windows [Version 10.0.22631.5189]

(c) Microsoft Corporation. All rights reserved.

C:\Users\setobox> boot --theme=light

[ OK ] loading profile

[ OK ] mounting content

[ OK ] applying light

setobox.dev ready.

Press any key to continue . . .

返回博客
2024/10/02更新 2026/06/171 min

主题变量:不要只换颜色

把主题拆成颜色、字体、边框、阴影、动效和组件气质,而不是简单切换 light/dark。

主题变量:不要只换颜色

主题不只是 palette

如果主题切换只修改背景和文字颜色,很快就会显得像演示,而不是完整体验。Setobox 的主题需要切换这些层级:

  • 色彩变量
  • 字体族
  • 圆角
  • 阴影
  • 加载动画
  • 文章卡片
  • 按钮和标签

为什么用 UnoCSS

UnoCSS 适合把设计 token 和 utility 写在一起。这里用 CSS variables 控制主题值,再用 UnoCSS shortcuts 把常用组件样式固定下来。

这让主题既能被全局切换,也能在局部组件里做更明显的风格差异。

三套首发主题

light-clean 用来保证阅读性,dark-clean 用来体现终端和日志感,dark-pixel 则负责更强烈的风格化展示。

三者共享内容结构,但组件呈现和加载方式不同。