亮色 / 暗色模式
Ophel 支持三种模式:
- 浅色 — 始终使用亮色主题
- 深色 — 始终使用暗色主题
- 跟随系统 — 自动跟随操作系统的外观设置
可通过浮动按鈕中的主题切换按鈕、快捷键 Alt / ⌥+D,或 设置 → 外观 切换。
开启跟随站点主题后,当 AI 平台(如 Gemini、ChatGPT)切换亮/暗模式时,Ophel
面板也会随之切换。可在 设置 → 外观 → 跟随站点主题
中控制,主题模式按站点独立保存。
同步原生页面颜色
开启后,Ophel 会在切换亮/暗模式时,同步调整 AI 平台页面上部分原生元素(如输入框、滚动条)的颜色,使整体视觉更一致。此功能仅对部分站点生效。
设置路径:设置 → 外观 → 同步原生页面颜色(默认开启)
当前站点的亮/暗模式始终跟随 Ophel 的设置。此选项仅控制是否额外同步页面原生元素颜色——如果某个站点出现视觉冲突,可关闭此项。
内置主题预设
每种模式各提供 12 套预设主题。
| 主题名 | 风格描述 |
|---|
| Google 渐变(默认) | 简洁白底,蓝绿渐变页头 |
| 紫罗兰 | 柔和紫色调 |
| 海洋蓝 | 宁静蓝色系 |
| 樱花物语 | 精致粉色花瓣调 |
| 清新薄荷 | 清爽绿色高亮 |
| 北欧霜雪 | 冷调北欧极简风 |
| 柠檬苏打 | 明快黄柠檬色 |
| 羊皮卷 | 温暖羊皮纸和棕褐色调 |
| 极致黑白 | 纯净黑白排版风格 |
| 青花瓷 | 中国青花瓷传统蓝白 |
| 奶油脆饼 | 温暖奶油饼干色调 |
| 独角兽 | 淡粉彩虹渐变梦幻 |
| 主题名 | 风格描述 |
|---|
| 经典深黑(默认) | 深灰面板,经典可读 |
| 午夜蓝 | 深蓝夜色 |
| 暗夜森林 | 暗绿色影调 |
| 赛博霓虹 | 霓虹灯电光暗色 |
| 醇香咖啡 | 温暖棕色暗色调 |
| 幻梦落日 | 紫橙落日渐变 |
| 德古拉 | 经典吸血鬼色方案 |
| 深海幽蓝 | 近乎纯黑的深邃暗色 |
| 猩红赤月 | 暗底深红点缀 |
| 黑客终端 | 绿字黑底复古终端风 |
| 代号:暴走 | 紫绿机甲风格 |
| 极光行者 | 蓝绿北极光色调 |
选择主题
打开设置
按 Alt / ⌥+, 或点击面板标题栏的设置图标。
选择并应用
切换顶部的”浅色”或”深色”标签,点击任意预设卡片即可预览并应用。
切换时会播放从点击位置向外辐射的圆形扩散动画(View Transitions API)。
自定义 CSS
在 设置 → 外观 → 自定义 CSS 中输入自己的 CSS 规则,实现全面定制。面板运行在 Shadow DOM 中,样式与页面其他部分完全隔离。
面板的样式使用 --gh- 前缀的 CSS 变量。你可以在自定义 CSS 中覆盖任意变量:
:host {
--gh-bg: #1a1a2e;
--gh-primary: #e94560;
--gh-text: #eaeaea;
}
常用变量:
| 变量 | 控制范围 |
|---|
--gh-bg | 主面板背景色 |
--gh-bg-secondary | 次级背景(侧边、交替行) |
--gh-text | 主文字颜色 |
--gh-text-secondary | 次级文字颜色 |
--gh-primary | 强调色 / 激活色(按钮、高亮) |
--gh-border | 边框颜色 |
--gh-shadow | 面板阴影 |
--gh-header-bg | 面板顶栏背景(支持渐变) |
--gh-danger | 删除 / 危险操作颜色 |
--gh-hover | 行悬停背景色 |
更改即时生效,无需刷新页面。
自定义样式可以保存为自定义主题预设,在不同主题之间快速切换而不影响全局设置。保存后,该样式会出现在主题预设列表中,与内置预设并列。