切換主題
選擇內建主題,或用少量顏色定義自己的 OpenCode TUI 主題。
📖 本篇術語速查表
| 英文 / 縮寫 | 中文 | 一句話解釋 |
|---|---|---|
| Themes | 主題 | OpenCode 的外觀配色。 |
| 可讀性 | readability | 配色保證看得清。 |
| 終端適配 | terminal | 適配終端配色能力。 |
不想讀完?把下面這段提示詞丟給 AI 幫你跑完——幫你給 OpenCode 選 / 配一套清晰好讀的主題。
你是 OpenCode 主題顧問。
【角色】
OpenCode 主題顧問,按最小夠用、安全優先的原則給可落地方案,每條結論都落到能照做的步驟或示例,不停留在空泛建議。
【輸入】
- 我用的終端和配色:___
- 偏好亮色還是暗色:___
- 對比度 / 可讀性需求:___
- 是否需自定義:___
- 經驗水平:___
【工作流程】
1. 說明主題機制
2. 按終端能力選主題
3. 保證可讀性和對比度
4. 說明自定義方式
5. 給驗證
【輸出規範】
▌一、主題機制
▌二、選主題
▌三、可讀性
▌四、自定義 + 驗證
【硬約束】
- 可讀性優先於花哨
- 適配終端真實配色
- 改後實測對比度
- 不要替我臆測情況或編造不存在的功能,資訊不全先問清
- 不確定的設定或介面一律以官方文件為準,禁止照搬過時寫法
- 給的每條結論都要落到具體可照做的步驟或示例,不停留在「建議」「考慮一下」這類沒法直接執行的空泛表述主題隻影響閱讀體驗,不影響模型能力。新手優先從內建主題開始,不要一上來複制一份幾百行配色表。
這一篇用 6 分鐘換什麼:你會知道主題該解決什麼問題、先試哪些內建主題、主題檔案放哪裡,以及怎麼用最少設定改善 TUI 可讀性。
先給結論:主題先解決可讀性
主題設定解決的是長時間閱讀、選單定位和 diff 對比時的可讀性問題。不要把主題當裝飾,真正要檢查的是正文、選中項、diff、新增刪除和錯誤提示。
正確順序是:
- 先選一個內建主題。
- 確認終端支援真彩色。
- 只在確實讀不清時自定義少數顏色。
- 最後才考慮完整主題。
flowchart LR
BuiltIn["內建主題"] --> Terminal["確認終端真彩色"]
Terminal --> Check["真實會話檢查 diff / 選單 / 錯誤狀態"]
Check --> Minimal["少量自定義顏色"]
Minimal --> Full["必要時再做完整主題"]
style BuiltIn fill:#dbeafe,stroke:#3b82f6
style Check fill:#dcfce7,stroke:#22c55e,stroke-width:2px
style Full fill:#fef3c7,stroke:#f59e0b
先選內建主題
OpenCode 內建多種主題,例如 system、tokyonight、everforest、ayu、catppuccin、catppuccin-macchiato、gruvbox、kanagawa、nord、matrix、one-dark,並且官方在持續新增。可以在 TUI 裡用 /theme 命令現場切換試看。
建議先試三個:
system:跟隨終端背景,適合已經精調過終端配色的人。tokyonight:暗色終端常用,層次比較清晰。catppuccin:對比度溫和,適合長時間閱讀。
在 tui.json 中指定主題:
{
"$schema": "https://opencode.ai/tui.json",
"theme": "tokyonight"
}終端先支援真彩色
如果主題顏色看起來發灰或不準,先檢查終端是否支援真彩色:
echo $COLORTERM輸出最好是 truecolor 或 24bit。多數現代終端預設支援;如果沒有,可以在 shell 設定裡設定 COLORTERM=truecolor。
自定義主題放哪裡
自定義主題是 JSON 檔案。OpenCode 會從這些位置載入:
| 位置 | 適合場景 |
|---|---|
~/.config/opencode/themes/*.json | 個人長期偏好 |
<project-root>/.opencode/themes/*.json | 專案統一視覺風格 |
./.opencode/themes/*.json | 目前工作目錄臨時主題 |
同名主題會被更高優先順序的目錄覆蓋。個人偏好放使用者級;團隊統一視覺風格才放專案級。
最小自定義主題
自定義主題不需要從完整配色表開始。先定義基礎顏色,確認讀寫舒服,再逐步細化語法高亮和 diff 顏色。
{
"$schema": "https://opencode.ai/theme.json",
"theme": {
"primary": "#88C0D0",
"accent": "#A3BE8C",
"error": "#BF616A",
"text": "none",
"background": "none",
"backgroundPanel": "#2E3440",
"border": "#4C566A"
}
}"none" 表示繼承終端預設前景色或背景色。它適合想讓 OpenCode 和終端整體外觀保持一致的場景。
建立和啟用主題
使用者級主題:
mkdir -p ~/.config/opencode/themes
vim ~/.config/opencode/themes/my-theme.json專案級主題:
mkdir -p .opencode/themes
vim .opencode/themes/my-theme.json建立後,在 tui.json 中把 theme 設定為檔名對應的主題名。
怎麼判斷主題可用
切換主題後,用一個真實會話檢查:
- 普通回答是否能連續閱讀十分鐘不累。
- 程式碼塊和正文是否有明顯區分。
- diff 新增和刪除是否不用猜。
- 目前選中的選單項是否足夠醒目。
- 錯誤、警告、成功狀態是否能一眼分辨。
如果這些都沒問題,就不需要繼續調色。主題設定的目標是降低閱讀負擔,不是追求設定完整。
接下來去哪
TUI 工作流
主題、滑鼠、diff 樣式和命令面板都屬於 TUI 使用體驗。
快捷鍵
視覺調順以後,再處理 leader key 和高頻快捷鍵衝突。
設定 OpenCode
理解 `tui.json` 和 `opencode.json` 的職責邊界。
終端 TUI 工作流
從日常任務角度理解 OpenCode TUI 裡的高頻控制點。
官方資料
- OpenCode Themes:https://opencode.ai/docs/themes
- OpenCode TUI:https://opencode.ai/docs/tui