前言¶
DeepSeek Harness(DSH)的 Web 殼層自帶亮/暗/跟隨系統等內置外觀,但長期使用同一套配色時,側欄、對話區、輸入框與代碼塊會混在一起,缺少可快速試用的主題入口。若你希望在 Harness 裏一次性切換整應用語義色、字體與部分風格特性(例如像素化的直角與掃描線),而不改核心配置,社區插件 wzuu/dsh-theme-studio 提供左側欄入口與主題選擇頁,把 5 套 Studio 風格與 43 個參考主題註冊到 DSH 的 ctx.theme 擴展點。
下面介紹該插件的定位、能力、安裝方式與典型用法。事實以 GitHub 倉庫 README 與 package.json 爲準。
這是什麼¶
wzuu/dsh-theme-studio 由維護者 wzuu 發佈,在 SkillHub 目錄中歸類爲「趣味換裝」。npm 包名爲 dsh-visual-styles(當前資料中的版本爲 1.1.0),許可證 MIT。
插件在左側欄增加 視覺風格 / Visual styles 入口,打開後可在緊湊卡片中選擇 5 種 Studio 風格,或在參考主題區搜索並選用 43 個亮/暗變體(分屬 28 個主題家族)。選定後立即作用於整個 Harness UI:側欄、對話、輸入區、菜單、對話框、代碼塊與狀態色等。另有 恢復系統外觀 / Restore app appearance 可回到內置亮/暗/系統設置。
核心功能¶
五種 Studio 風格¶
| 風格 | 明/暗 | 特點(README 描述) |
|---|---|---|
| 紙墨 Paper | Light | 暖色紙感、柔和墨色、硃紅點綴、襯線字體 |
| 深海 Abyss | Dark | 深藍綠表面、明亮青綠點綴 |
| 像素 Pixel | Dark | 硬直角、等寬字體、青檸/品紅、CRT 掃描線 |
| 霓虹 Neon | Dark | 午夜紫、電青與品紅光暈 |
| 森野 Grove | Light | 苔蘚、亞麻、陶土色、穩重對比 |
Pixel 模式在 html[data-dsh-theme-studio="pixel"] 下注入作用域 CSS:方角、等寬 UI、塊狀層級與輕微掃描線疊加。
43 個參考主題¶
第二區提供 43 個亮/暗變體,家族包括 Absolutely、Ayu、Catppuccin、Codex、Dracula、Everforest、GitHub、Gruvbox、Linear、Lobster、Material、Matrix、Monokai、Night Owl、Nord、Notion、One、Oscurange、Proof、Raycast、Rose Pine、Sentry、Solarized、Temple、Tokyo Night、Vercel、VS Code Plus、Xcode 等。卡片按家族分組;搜索框可按主題名、家族、變體或明/暗模式過濾。
實現要點(無外鏈資源)¶
- 每個主題通過 DSH
ctx.theme註冊大量--dsw-*語義 token,殼層各區域跟隨所選主題。 - 43 個參考主題由種子文件中的背景、前景、強調色、diff 色、語法色、UI/代碼字體、對比度與窗口透明度等生成;缺失語義色由種子推導,必要時將文本對比提升至至少 4.5:1。
- 啓動器註冊在
sidebar.panellist;選擇頁註冊在根作用域main的theme-studio鍵位。 - 不導入 DSH Client 包;React 來自瀏覽器模塊表;圖標爲內聯 SVG。無網絡請求、遠程字體或圖片資源。
開發驗證記載:48 個主題各 253 個 token;主/次/強調按鈕對比在各主題上不低於 4.5:1。
安裝與啓用¶
官方 README 給出的安裝方式是將該目錄作爲 bundle 裝入當前 DSH 配置(示例爲 desktop profile)。安裝前應自行審閱源碼與 MIT 許可證;插件在當前 DSH 進程權限下運行,與目錄站無官方從屬關係。
git clone https://github.com/wzuu/dsh-theme-studio.git
plugin_manager install_bundle "$(pwd)/dsh-theme-studio"
卸載:
plugin_manager remove_bundle dsh-visual-styles
卸載會釋放全部 48 個主題註冊、注入樣式表、側欄入口、主頁面及文檔上的作用域屬性。
安裝後若側欄入口未立刻出現,刷新頁面一次(macOS 上爲 Cmd+R)。新裝或替換 client bundle 後,運行中的頁面通常也需刷新一次,屬 DSH client 模塊行爲。
典型用法¶
- 在左側欄打開 視覺風格 / Visual styles。
- 點選一張 Studio 卡片,或在參考區搜索後點選主題;整應用 UI 立即切換。
- 需要回到 Harness 內置外觀時,使用 恢復系統外觀 / Restore app appearance。
- 最後一次自定義選擇保存在當前瀏覽器的
localStorage;若在設置裏改回內置亮/暗/系統,會清除該記錄。
本地開發自檢可執行:
npm run check
適用場景與注意¶
適合希望在 DSH Web UI 中快速試配色與字體、或偏好 Pixel/霓虹等強風格化的開發者。不適合把第三方主題 id 寫進 DSH 內置 ui-theme 設置 schema 的場景:README 說明這類 id 爲進程內擴展,持久化由插件自行使用 localStorage 完成。
字體僅使用本機已安裝字體族;參考主題中命名的 Inter、Satoshi、Geist、JetBrains Mono 等未隨插件打包,若需完全一致排版需自行安裝。參考種子僅爲顏色與排版數據,不含 ChatGPT 相關素材。
結尾¶
dsh-theme-studio 把 5 套 Studio 風格與 43 個參考主題收斂到左側欄一個入口,通過語義 token 覆蓋整殼層,並支持一鍵恢復系統外觀。目錄頁:SkillHub - wzuu/dsh-theme-studio;源碼與說明:GitHub - wzuu/dsh-theme-studio。