Foreword

DeepSeek Harness (DSH)’s web shell comes with three built-in appearances: light, dark, and system. However, third-party color palettes require a plugin to integrate with the theme runtime for persistent effects. Staring at the same interface color scheme for a long time, or wanting to place a custom wallpaper behind the dialog window, is not possible with the built-in options alone.

dsh-skin, maintained by KinGao294, registers 7 curated skins on top of DSH’s built-in theme system, and provides a local wallpaper layer and a draggable desktop pet. The selection is written to the browser’s localStorage and persists after refresh—a concept similar to Codex themes, but targeting DSH’s --dsw-alias-* token layer.

What is this?

dsh-skin is a dual-sided DSH plugin (dsh.bundle Host patch + dsh.client browser bundle), currently at version 0.4.0, under the MIT license. It inserts three setting rows below the built-in Appearance line in Settings → General:

  • Skins — 7 curated color palettes, or Default to follow the built-in appearance.
  • Wallpaper — Local images or pasted image/video URLs, with adjustable opacity, blur, and display mode.
  • Pet — A draggable floating desktop pet that switches expressions based on the Agent’s running status, with 8 manual stickers included.

The plugin is categorized as “Fun Dress-up.” GitHub repository: KinGao294/dsh-skin; community directory page: SkillHub.

How it works

DSH’s theme system is based on design tokens: the web shell predefines --dsw-* tokens, and ThemeRuntime allows third-party plugins to override the alias layer (--dsw-alias-*) via ctx.theme.register(...), driving body[data-ds-dark-theme] based on colorScheme (light / dark).

The Host side of dsh-skin (lib/index.js) is a standard patch layer that inserts a skin loader entry. The browser side (lib/client.js, mounted at /plugins/dsh-skin/client.js) is responsible for:

  1. Registering 7 skins and restoring the last selection;
  2. Rendering the wallpaper on a fixed layer with z-index: -1, while using ctx.theme.overrideTokens to make the main canvas (--dsw-alias-bg-base) and sidebar (--dsw-specific-sidebar-fill) semi-transparent, while keeping inner cards, input boxes, and bubbles opaque;
  3. Listening to theme/change to sync the wallpaper hue during skin switching or light/dark toggling;
  4. Mounting the settings row and desktop pet, observing the Agent’s running status via ctx.get("sessions").list().

Seven Skins

Skin IDs are named with the skin-* prefix to avoid conflicts with official @deepseek-ai/dsh-client-ui-console themes (e.g., sakura, graphite). Older unprefixed IDs are automatically migrated upon reading.

id scheme Style
skin-ocean dark DeepSeek blue deep sea
skin-graphite dark Neutral monochrome
skin-forest dark Green calm
skin-sunset dark Warm purple tone
skin-midnight dark Pure black OLED
skin-paper light Warm paper
skin-sakura light Pink accent

Selecting Default clears the stored skin ID and reverts to the built-in system/light/dark logic. DSH itself only persists system/light/dark; third-party skins are reapplied by this plugin at startup.

Custom Wallpaper

Configure in Settings → General → Wallpaper:

  • Choose image — Local image (≤ 2MB, stored as a data URL, only retained in the current browser). Local video files are not uploaded; paste a URL instead.
  • URL — Supports http(s) / data images or videos (mp4 / webm / ogv / mov). blob: URLs are rejected (invalid after refresh) and no additional media service is needed.
  • Fitcover / contain / stretch / tile.
  • UI wash and Blur sliders — Higher wash makes the UI more solid; larger blur softens the background.
  • Remove — Clears the wallpaper.

The wallpaper is only visible in the semi-transparent main canvas and sidebar areas; reading areas like message bubbles remain opaque. During skin switching, semi-transparent surfaces recolor according to the current skin’s hue.

Desktop Pet

Settings → General → Pet allows toggling the pet, adjusting its size (64–180 px), and resetting its position.

Pet behavior:

  • Status link — Switches to thinking at round start, working during execution, done (with a flash) at completion, then back to idle; long idle enters sleeping (Zzz).
  • Emoji pack — Hover to open the 🎨 panel, with 8 emotion stickers for manual switching (idle / happy / thinking / working / done / sad / surprised / sleeping); clicking the pet also randomly switches stickers for a few seconds.
  • Draggable — Drag anywhere; coordinates are saved to dsh-skin:pet-pos.
  • Zero external resources — All stickers are inline SVGs (original hand-drawn milk dragon style, not licensed character images), with no additional dependencies in the bundle, and clear at any size. The preview.html in the repository previews the full sticker pack.

Persistence

The following keys are saved in the browser’s localStorage:

  • dsh-skin:skin
  • dsh-skin:wallpaper, dsh-skin:wallpaper-opacity, dsh-skin:wallpaper-blur, dsh-skin:wallpaper-fit
  • dsh-skin:pet-enabled, dsh-skin:pet-size, dsh-skin:pet-pos

DSH Host’s WEB_SETTINGS_NAMESPACES whitelist has not yet exposed third-party namespaces to the browser, so visual preferences use localStorage instead of cross-process synchronization—consistent with DSH’s current “browser preferences are local to the process” boundary, restoring after refresh under the same origin.

Installation and Enabling

DSH’s plugin distribution channel is the npm registry; packages must declare dsh.bundle and dsh.client. In any directory, run the following to add the package to the web profile:

dsh plugin --profile web add -w dsh-skin

The -w flag is required: each profile comes with a pnpm-workspace.yaml, pnpm 9 treats the profile directory as the workspace root, and a bare add would throw ERR_PNPM_ADDING_TO_ROOT.

The command runs pnpm installation in ~/.dsh/profiles/web and writes the package to dsh.profile.bundles (the patch layer inserts a skin loader). After installation, restart the web service:

# Stop the current instance first, then start:
dsh web

Open Settings → General to use the skins, wallpaper, and pet.

For development installation from a local path, replace the package name with the path:

dsh plugin --profile web add -w /path/to/dsh-skin

Typical Usage

  1. Start dsh web and go to Settings → General.
  2. In the Skins dropdown, select a palette (e.g., skin-ocean) for an immediate interface switch; select Default to revert to the built-in appearance.
  3. In Wallpaper, upload a local image or paste an image URL, adjust the UI wash and Blur to balance readability and ambiance, and set the Fit to cover or tile.
  4. Open Pet, drag it to a non-intrusive position; observe the expression changes as the Agent runs, or hover over the 🎨 to manually select stickers.
  5. Refresh the page to confirm that the skin, wallpaper, and pet position have been restored.

Use Cases and Notes

Suitable for:

  • Individual developers who use the DSH web interface for extended periods and want to change the color scheme or add a background;
  • Users who need to differentiate work atmospheres (dark for focus / light for reading) on the same machine;
  • Plugin authors who want to experience third-party theme capabilities without modifying DSH’s core code.

Notes:

  • The plugin runs with the current dsh process permissions; read the source code before installation and confirm the MIT license aligns with your security policies.
  • Wallpaper and skin preferences are only stored in the current browser’s localStorage; switching browsers or clearing the cache will lose them. Large images are subject to the 2MB local limit.
  • Video wallpapers rely on accessible http(s) URLs and do not support blob:.
  • The client bundle can only require entities in the module table (platform seed + registered client bundles); adhere to DSH rc.6’s module boundaries when developing extensions.
  • The SkillHub community directory is an independent site with no official affiliation with DeepSeek /幻方.

Links