dsh-easy-appearance icon # dsh-easy-appearance Persistent appearance settings for the DeepSeek Harness WebUI [中文](README.md) · [Install](#install-into-official-dsh-011-rc2) · [Configuration](#configuration) · [Troubleshooting](#troubleshooting) [![MIT License](https://img.shields.io/badge/license-MIT-8EA2EE.svg)](LICENSE) [![DSH 0.2.0-rc.2](https://img.shields.io/badge/DSH-0.2.0--rc.2-14b8a6.svg)](#verified-snapshot) [![Release](https://img.shields.io/github/v/release/Zhen-WushuiLingchun/dsh-easy-appearance?include_prereleases)](https://github.com/Zhen-WushuiLingchun/dsh-easy-appearance/releases)
A community-maintained DeepSeek Harness WebUI extension. It adds light/dark palettes, wallpaper, opacity, fonts, selected VS Code theme mapping, and custom CSS to DSH's native Settings → Appearance page, and persists the complete configuration in the plugin's own profile entry `Config` (the DSH `0.2.0-rc.2` configuration form is the only writer). > [!IMPORTANT] > Version `0.2.0` is an official DSH Profile Bundle. Installation neither modifies nor rebuilds the official DSH source tree. This project is not an official DeepSeek release. ![Wallpaper and unified accent showcase](assets/appearance-showcase.png) > Documentation images have been sanitized to remove real workspace names, paths, and conversations. They demonstrate the plugin's appearance; the running DSH version remains authoritative for exact controls. ## Features | Capability | Behavior | | --- | --- | | Light / dark / system mode | Keeps DSH `ui-theme` mode selection and stores separate light and dark palettes | | Unified accent | Projects one accent into brand, business-state, and info-button tokens for tabs, folders, links, focus, carets, and send controls | | Wallpaper | Accepts HTTP(S) URLs, local image uploads, and four built-in gradient presets | | Opacity and scrim | Controls application-surface visibility independently from the wallpaper readability scrim | | Fonts | Supports UI and code font stacks with common presets | | VS Code theme import | Maps five core colors from a theme JSON `colors` object | | Custom CSS | Loads text or `.css` files live and persists the result | | Layout actions | Collapses/expands the sidebar and opens/closes the details pane | | Host persistence | Restores after refresh, plugin reload, or DSH restart and verifies each write against the Host user layer | ## Screenshots ### Appearance settings ![Appearance settings page](assets/appearance-settings.png) The section is embedded in DSH's existing settings UI instead of creating a second configuration application. Light and dark schemes keep independent accent, text, background, and sidebar values. ### One accent across major interaction states ![Accent token coverage](assets/accent-token-coverage.png) The early prototype only changed `brand-primary`, so the send button, folders, links, and current chat tab could keep the stock blue. The formal package projects the configured accent into: ```text --dsw-alias-brand-primary --dsw-alias-brand-primary-new-colorprimary-new-color --dsw-alias-state-business-primary --dsw-alias-state-business-tertiary --dsw-alias-button-info-fill --dsw-alias-button-info-hover ``` Disabled controls still use each component's normal reduced-opacity rule. ## Verified snapshot | Item | Value | | --- | --- | | Package | `@deepseek-ai/dsh-client-ui-appearance` `0.3.1` | | Official DSH | `0.2.0-rc.2` (npm-published client packages) | | DSH baseline | `npm:@deepseek-ai/dsh-client-*@0.2.0-rc.2` | | Verification date | 2026-09-29 | | Formal source and bundle | `packages/client/ui-appearance/` | | Integration | root `package.json` + `cordis.patch.yml` Profile Bundle | | Durable location | the `ui-appearance` entry's own `Config.config` (a `volatile()` string) | > **Version pairing**: `0.3.x` targets DSH **`0.2.0-rc.2`**, the runtime the official Desktop app ships; `0.2.x` targets `0.1.1-rc.2` and never activates on Desktop. Check your DSH version first, or Appearance will not appear in Settings. The published file count and SHA-256 tree digest are recorded in [`integration/tested-snapshot.json`](integration/tested-snapshot.json) and can be reproduced locally. The old `host.js` / `prototype.client.js` implementation lives under [`legacy-prototype/`](legacy-prototype/README.md) for historical reference only. It is not the recommended installation. ## Install into official DSH 0.2.0-rc.2 ### Requirements - Official `@deepseek-ai/dsh` `0.2.0-rc.2` installed and runnable - Node.js `^22.19.0` or `>=24.0.0` - Windows PowerShell 5.1 or PowerShell 7+ for the helper scripts - A backup of `$DSH_HOME/profiles//cordis.patch.yml` is recommended ### Automated install ```powershell git clone https://github.com/Zhen-WushuiLingchun/dsh-easy-appearance.git cd dsh-easy-appearance ./scripts/verify-rc2-compat.ps1 ./scripts/install-into-dsh.ps1 ``` The helper validates the DSH version and invokes the official Profile Bundle command: ```powershell dsh plugin --profile web add . ``` A packed `.tgz` is also supported. Once `0.3.1` is published, the GitHub source can be installed directly: ```powershell dsh plugin --profile web add D:\path\to\deepseek-ai-dsh-client-ui-appearance-0.3.1.tgz dsh plugin --profile web add github:Zhen-WushuiLingchun/dsh-easy-appearance ``` Fully exit and restart `dsh web` or DSH Desktop. Appearance should then be present in Settings. Installation only updates the selected DSH home's `profiles/web` dependencies and bundle list; it does not alter the official program directory. A custom profile can be selected with `./scripts/install-into-dsh.ps1 -Profile my-web`. ## Configuration ### Theme and colors - **Theme mode:** light, dark, or system; DSH `ui-theme` remains the owner. - **Palette target:** select the light or dark palette before editing it. - **Accent:** active chat tab, folder, link, send, selection, and focus states. - **Foreground / secondary:** primary content and supporting information. - **Background / sidebar:** base WebUI surfaces; the base token becomes transparent while wallpaper is active. - **Contrast:** applies a shared lightness adjustment to surfaces. - **Surface opacity:** lower values reveal more wallpaper. Selecting an image sets it to 50%; 100% hides wallpaper behind opaque surfaces. ### Wallpaper Enter an `https://...` or `data:image/...` URL, upload a local image through `FileReader`, or choose the Twilight Violet, Deep Ocean, Jade, or Ember built-in gradient. Large embedded images remain fully persisted, but the URL field shows an estimated size instead of binding several megabytes of Base64 to a text control; this avoids blank painting in Electron while preserving the wallpaper. Adjust the separate scrim to retain foreground readability. Wallpaper is painted once on the `body` canvas. While enabled, the shared base-background token becomes transparent so nested WebUI surfaces do not compound 50% opacity and obscure the image. ### VS Code themes The importer reads the top-level `type` and `colors` objects, then maps available values to accent, background, foreground, secondary text, and sidebar. `tokenColors`, the complete border system, and complex state colors are not mapped in this release. ### Fonts and custom CSS - UI fonts accept any CSS `font-family`; presets include Inter, Microsoft YaHei, and default. - Code presets include JetBrains Mono, Fira Code, SF Mono, and default. - Custom CSS can be edited directly or loaded from a `.css` file and is injected through a package-owned `