从零做一套自己的 Agent 主题

先定背景,强调色最后再说

新手通病是先爱上一个强调色,再硬凑其余十二个。反着来。13 个 token 里有 4 个是背景层:窗口底色、侧栏和状态栏用的面板底色、代码块底色、边框。语法一个字还没出现,这四层就已经决定了主题是"扎实"还是"浑浊"。

深色主题别用纯黑。我们的自家深色 Ember Shift 用 #101012 做窗口、#17171a 做面板、#0b0b0d 垫代码:三个几乎相同的灰,眼睛却能不靠边框分清层次。浅色主题要的是暖而不是亮——Paper Terminal 的 #f7f4ec 更像书纸而不是灯箱。无论走哪个方向,代码底色和主底色差半档就好;边框要安静——你注意到边框,它就太吵了。

两个文字色扛一整天

text 是你连续读几个小时的正文,textMuted 是时间戳、文件名这些次要信息。正文对底色,是 WCAG 4.5:1 对比度真正该管的地方——低于它,长会话就变成眯眼比赛。muted 刻意停在 3:1 附近:再往上推,"次要"就不存在了,层级塌成一个平面。

语法四色:靠色相分,不靠明度

string、keyword、func、comment。经典四件套,经典错误是把它们做成同一色相的四档明度——截图里显得克制,真实会话里糊成一锅。要靠色相拉开:Dracula 的绿字符串、粉关键字、紫强调能被移植四百多个应用,就是因为色轮上互不挨着。

两条实用规则。注释要往后退,直接复用 muted 文字色很常见也很诚实。字符串则比在编辑器里更重要:agent 界面习惯把 diff 新增行染成字符串绿(我们的预览就是这么做的),这个绿会标记 agent 写进你代码的每一行——选一个你看得惯的。

error 和 warning 是承重墙

在编辑器里它们是波浪线;在 agent 窗口里,error 是测试挂掉和 diff 删除行的颜色,warning 是"做不可逆操作前先问你"的颜色——恰恰是最不能看错的时刻。error 留在红系,warning 留在琥珀系,几十年的界面语法别拿一套主题去挑战。两个都要在主底色上验过;warning 别贴着强调色,不然警告长得像按钮。

强调色只有一个,任务也只有一个

光标、你自己的消息、主按钮,归强调色管。它是主题的签名,个性都给它:Ember Shift 的 #ff9e3d 火种橙、Neon Garden 的 #59e3a7 薄荷绿。检验方式很实际:往回翻一段长会话,你自己的提问要在一臂距离外就跳出来。要找半天,就是太害羞了。

对比度:真会跑的土办法

记两个数:正文 4.5:1,大字和界面元素 3:1。晚上 11 点没人打开色彩科学工具,所以用你真会跑的测试。其一,随便找个免费的在线对比度检查器,贴两个色值读比值。其二,眯眼测试:眯到画面模糊,最先消失的就是不达标的。其三,灰度测试:macOS 和 Windows 的辅助功能都能把整个屏幕切成灰度,色相在那里帮不了你——灰度下还活着的才是真对比。

重点跑最容易翻车的三对:正文对底色、注释对代码底色、error 对底色。中招最多的是注释对代码底——调着调着两个值都往暗处漂,代码注释就成了鬼影。

在预览工具里迭代

把手头的东西粘进粘贴预览工具:裸 JSON、零散色值、codex-theme-v1:… 串都认。解析全在浏览器里完成,什么都不上传;识别出的 token 会映射到完整的 agent 窗口模拟上,每个值都能就地微调。模拟窗里特意放了一个 diff 块。十轮十分钟,在模拟窗里扛过眯眼测试的版本,才值得装。

落地到 Codex 和 Claude Code

Codex 应用:在外观设置里创建自定义主题,把 13 个值填进去;或者给自己写一段安装指令——贴上色值,要求只改外观设置、汇报所有改动。"汇报"那句是全部诀窍:回复本身就是还原清单。本站每个安装提示词都这么写,原因也在这。

Claude Code:运行 /theme,v2.1.118 起支持创建自定义主题;老版本先在终端层装好配色,再选 dark-ansi / light-ansi 预设继承终端的 16 色。分步版见Codex 安装教程和Claude Code 教程。

分享给同事

做完的主题就是一段 JSON。把 13 个 token 发给同事,对方先粘进预览工具看效果,再用同样的安装指令套路应用。没有文件、没有扩展商店、没有要维护版本号的产物——主题小到这个程度,反而是件好事。