Skip to content

Repository files navigation

Codex Skin · RX-78-2 WHITE BASE

Codex 桌面端(ChatGPT.app for macOS)做的一套 Apple 液态玻璃风格皮肤。 整屏壁纸 + 纯 CSS 玻璃质感 + 三色强调,不修改 Codex 官方安装包,随时一键还原。

首页

任务页

上图是本仓库开箱即用的默认样子。壁纸可以换成你自己的——见 换成你自己的皮肤


装起来

前提:macOS + 已装 Codex 桌面端(ChatGPT.app)。不需要装 Node、Homebrew 或任何别的东西。

git clone https://github.com/roam-bit/Codex-skin-gundam.git

然后双击 一键安装.command。它会自动做完这些:

  1. 没有皮肤引擎就自动下载
  2. 把引擎基础层、全部叠加层和壁纸烘焙成一个自包含的 CSS
  3. 备份引擎原版(只备份一次,不会把皮肤当原版覆盖掉)
  4. 带调试端口重启 Codex 并注入
  5. 装上后台代理:开机自启 + 每 20 秒自愈
  6. 连上调试端口验证皮肤真的进了页面,不是只看日志

看到 ✅ 安装完成,皮肤已生效。 就成了。

首次运行 .command 文件时 macOS 可能拦一下("无法验证开发者")。 右键点文件 → 打开 → 再点"打开"即可。

不想要了:双击 卸载还原.command,Codex 回到官方原样。


换成你自己的皮肤

换壁纸

双击 换壁纸.command,把图片拖进窗口回车,剩下的自动完成(转格式 → 重新烘焙 → 重装 → 验证)。

三张图各管一处:

用在哪 建议尺寸
首页大壁纸 首页整屏 16:9 横图,长边 ≥2400px
任务页壁纸 任务页整屏 同上(可以和首页同一张)
拍立得 首页右下角小照片 方图,420×420

挑图的两条经验(都是踩出来的):

  • 主体偏右、左侧留白 —— 皮肤的标题和文字压在左边,主体在中间会打架。
  • 图要有硬结构,别用纯柔和渐变 —— 玻璃层有 48–64px 的模糊,平渐变会被糊成一片死白,什么都剩不下。有线条、有块面、有明暗边界的图才扛得住。

换文案

layers/brand-tokens.css 里的三行,然后双击 一键安装.command 重新烘焙:

html.codex-dream-skin {
  --skin-nameplate:   "RX-78-2 GUNDAM · SCV-70 WHITE BASE · 限定皮肤";  /* 顶栏铭牌 */
  --skin-watermark:   "E F S F";                                        /* 首页大字水印 */
  --skin-photo-label: "SCV-70 WHITE BASE";                              /* 拍立得标签 */
}

换配色

theme/theme.json 里的 colors(强调色 / 次色 / 高亮),以及 tagline(首页副标题)。


它是怎么工作的

你的图 + 全部样式层
        │
        │  bake.mjs  ← 拼接叠加层、把图片内联成 data URI、校验注释配对
        ▼
   dream-skin.css (单文件,自包含)
        │
        │  引擎的注入器通过 Chrome DevTools 协议(仅本机回环)注进 Codex 窗口
        ▼
     穿上皮肤的 Codex
  • 不碰 Codex 安装包:不解包 app.asar、不改任何官方文件,只在运行时往页面里插一个 <style>
  • 为什么必须烘焙:注入进页面后没有"相对路径"可言,图片不内联就一定加载失败。
  • 为什么要重启 Codex:从程序坞正常打开的 Codex 不带调试端口,注入器连不上。安装脚本会带端口重启它;之后手动打开也没关系,自愈巡检 20 秒内会处理。

目录结构

路径 是什么
layers/ 叠加样式层,改样式改这里(顺序见 bake.mjs 顶部)
layers/_engine-base.css 引擎原版基础样式(上游 MIT 代码,锁定在 v1.2.0)
theme/ 壁纸与主题配置
runtime/ 注入器(含可拖拽拍立得)、自愈脚本、自启动脚本
harness/ 调试试验台:假的 Codex 页面 + 真 CSS,改样式先在这里预览,不用反复重启 Codex
bake.mjs 烘焙器
verify-skin.mjs 验证皮肤是否真进了页面
docs/踩坑笔记.md 这个项目最值钱的部分 —— 见下

改样式的正确姿势

# 1. 改 layers/ 里的某一层
# 2. 在试验台预览(不用重启 Codex)
cd harness && python3 -m http.server 8080
# 浏览器打开 http://localhost:8080  (需要先烘焙一次,把 dream-skin.css 放进 harness/)
# 3. 满意后重新安装
./一键安装.command

出问题了

改了 CSS 却没变化 —— 十有八九不是你 CSS 写错了,是根本没注入进去。跑这个:

node verify-skin.mjs --expect "你新写的选择器片段"

它会连上调试端口,直接读页面里那个 <style>实际内容。说"不含"就是没进去,重跑一次 一键安装.command

⚠️ 不要靠看日志判断。注入器日志里有历史成功记录,grep "injected verified" 恒为真,是假信号。 而 pkill 经常杀不掉旧注入器,它会继续服务自己启动时读进内存的旧 CSS。 这个坑吞掉了本项目最多的时间,verify-skin.mjs 就是为它写的。

皮肤突然没了 —— 多半是 Codex 被正常打开了(没带调试端口)。等 20 秒自愈,或双击 一键安装.command

装完没反应 —— 先确认 Codex 窗口加载完了,再重跑一次安装脚本。


踩坑笔记

docs/踩坑笔记.md 记了这个项目撞过的所有硬钉子:CSS 选择器误伤、特异性提权、height 会打断滚动、launchd 的 TCC 限制、ps -o etimes 在 launchd 下失效……

如果你要改这个皮肤,那份笔记比 README 有用。


致谢与许可

  • 注入引擎:Fei-Away/Codex-Dream-Skin(MIT)。本仓库的 layers/_engine-base.cssruntime/renderer-inject.js 基于其代码修改。
  • 玻璃质感参考 Apple 的液态玻璃设计语言,纯 CSS 实现,零 SVG 滤镜依赖。

本仓库代码(样式层、烘焙器、脚本、文档)以 MIT 许可发布,见 LICENSE

壁纸素材不在 MIT 范围内 —— 默认壁纸是 RX-78-2 实体像的照片,角色版权归万代所有。 本项目是非商业同人作品,与万代、日升、OpenAI 均无关联。 详见 NOTICE.md

About

Codex 桌面端(ChatGPT.app for macOS)的 Apple 液态玻璃皮肤 · 不改官方安装包,一键安装与还原 · 壁纸可换成你自己的

Topics

Resources

Stars

2 stars

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages