主题
OxideTerm 包含一个全面的主题引擎,让你可以自定义应用外观的方方面面——从终端 ANSI 颜色到整个 UI 界面。
OxideTerm 附带 31+ 内置主题,均针对终端可读性优化。默认深色主题专为长时间终端工作设计,精心选择了对比度比例。
主题涵盖多种风格:经典深色/浅色、Dracula、Solarized、Monokai、Nord、One Dark、Gruvbox、Tokyo Night 等。
通过带实时预览的可视化编辑器创建自己的主题。更改即时可见——无需重启。
终端颜色(20 个字段)
Section titled “终端颜色(20 个字段)”自定义全部 16 种 ANSI 颜色加 4 个额外字段:
| 字段 | 描述 |
|---|---|
| ANSI 0–7 | 标准颜色(黑、红、绿、黄、蓝、品红、青、白) |
| ANSI 8–15 | 高亮/粗体变体 |
| 前景色 | 默认文本颜色 |
| 背景色 | 终端背景 |
| 光标色 | 光标颜色 |
| 选区色 | 文本选择高亮 |
UI 颜色令牌(23 个字段)
Section titled “UI 颜色令牌(23 个字段)”通过结构化颜色字段自定义整个原生应用界面:
背景层(8 个字段)
Section titled “背景层(8 个字段)”| 变量 | 用途 |
|---|---|
bg | 主背景 |
bgPanel | 面板/侧边栏背景 |
bgCard | 卡片背景 |
bgHover | 悬停状态背景 |
bgActive | 激活/按下状态 |
bgSecondary | 次要背景区域 |
bgElevated | 浮起表面(对话框、菜单) |
bgSunken | 凹陷表面(输入框、凹槽) |
文本层(4 个变量)
Section titled “文本层(4 个变量)”| 变量 | 用途 |
|---|---|
text | 主文本颜色 |
textMuted | 柔和/次要文本 |
textSecondary | 第三级文本(时间戳、提示) |
textHeading | 标题文本颜色 |
边框层(3 个变量)
Section titled “边框层(3 个变量)”| 变量 | 用途 |
|---|---|
border | 标准边框 |
borderStrong | 强调边框 |
divider | 分隔线 |
强调色层(4 个变量)
Section titled “强调色层(4 个变量)”| 变量 | 用途 |
|---|---|
accent | 主强调色(按钮、链接) |
accentHover | 强调色悬停状态 |
accentText | 强调色背景上的文本 |
accentSecondary | 次要强调色元素 |
语义层(4 个字段)
Section titled “语义层(4 个字段)”| 变量 | 用途 |
|---|---|
success | 成功指示器 |
warning | 警告指示器 |
error | 错误指示器 |
info | 信息指示器 |
- 字体系列 — 终端等宽字体
- 字体大小 — 像素值
- 行高 — 行间距
主题引擎可自动从终端 ANSI 调色板生成 UI 颜色:
- 设置你偏好的终端 ANSI 颜色(16 种标准颜色)
- 在主题编辑器中点击 自动衍生
- OxideTerm 分析调色板的色相、饱和度和亮度
- 生成与终端调色板协调一致的背景色、文本色、边框色和强调色
这意味着你可以从任何终端配色方案出发,一键获得匹配的完整应用主题。
自动衍生算法将终端颜色映射到 UI 颜色:
| 终端源 | 生成的 UI 颜色 |
|---|---|
background | bg、bgPanel (+15)、bgHover (+30)、bgActive (+40)、bgSecondary (+10) |
foreground | text |
brightBlack | textMuted;与前景色混合 → textSecondary |
background | border (+30)、divider (+20) |
cursor | accent、accentHover (−20);与背景色混合 → accentText |
brightBlack | accentSecondary |
green | success |
yellow | warning |
red | error |
blue | info |
+N 表示对每个 RGB 通道添加固定增量(钳制在 0–255)。用户始终可以手动覆盖任何衍生颜色。
可视化主题编辑器提供:
- 主题名称 输入 — 自由文本;自动生成 slug 作为主题 ID
- 基于 下拉菜单 — 创建新主题时可从任何内置主题复制
- 实时预览 — 迷你终端模拟,带彩色提示符、git 输出和闪烁光标;UI 镀铬条显示强调色按钮、悬停状态、面板和语义状态点
- 终端颜色标签 — 4 列 20 个色块网格,每个带原生取色器和十六进制输入(
#RRGGBB) - UI 颜色标签 — 五个分组区域(背景、文本、边框、强调色、状态色),带”从终端自动衍生”按钮
- 保存 — 写入 OxideTerm 设置并立即生效
- 删除 — 移除自定义主题(仅编辑模式)
- 打开 设置 → 外观
- 浏览内置主题并即时预览
- 选择主题即时生效——无需重启
- 点击新建主题并使用可视化编辑器创建自定义主题
内置主题工作原理
Section titled “内置主题工作原理”内置主题由 oxideterm-theme crate 提供终端颜色和 UI 颜色令牌。选择主题后,工作区生成新的 ThemeTokens,GPUI 控件与原生终端在下一次绘制时使用同一套配色。
自定义主题工作原理
Section titled “自定义主题工作原理”自定义主题保存完整的终端颜色与 UI 颜色字段。运行时优先从当前自定义主题生成 ThemeTokens,无需网页样式覆盖层。
自定义主题存储在 OxideTerm 设置的 custom_themes 映射中:
{ "custom:my-neon": { "name": "My Neon", "terminalColors": { "background": "#0a0a0f", "foreground": "#e0e0ff", "cursor": "#ff00ff", "black": "#1a1a2e", "red": "#ff3366" }, "uiColors": { "bg": "#0a0a0f", "bgPanel": "#14142a", "accent": "#ff00ff", "success": "#00ff88", "warning": "#ffcc00", "error": "#ff3366", "info": "#3388ff" } }}主题 ID 遵循 custom:{slug} 模式,slug 由显示名称衍生(小写,非字母数字字符替换为连字符,保留 CJK 字符)。
- 导出:将自定义主题保存为 JSON 文件
- 导入:从设置面板加载 JSON 主题文件
- 主题 JSON 文件包含所有终端颜色、UI 颜色令牌和字体设置,单个文件即可移植