dsh-skin-collection
Multi-style skin collection for the DeepSeek Harness web GUI. Each skin registers a theme plus scoped decoration CSS; a sidebar picker manages skins and the base color scheme independently — the default style restores the stock UI completely.
English | 简体中文
Skins
| Theme id | Style | Scheme | Signature effects |
|---|---|---|---|
wabi-sabi |
Wabi-Sabi 侘寂 | light | Earth palette, paper grain, serif type, sepia images, Enso boot fade, vermillion DSH seal brand mark |
terminal |
Terminal 终端 | dark | Phosphor green on void black, VT323 mono, CRT scanlines + text glow, blocky scrollbar |
cyberpunk |
Cyberpunk 赛博朋克 | dark | Cyan/magenta/acid neon on deep teal, Space Grotesk, scanlines, chamfered images |
film-noir |
Film Noir 黑色电影 | dark | Chiaroscuro vignette, film grain, Oswald + typewriter body, grayscale photos with hover restore |
swiss |
Swiss 国际主义 | light | Off-white grid, Inter black uppercase headings, Swiss red accents, sharp corners |
bauhaus |
Bauhaus 包豪斯 | light | Primary-color flat geometry (red/blue/yellow), Jost, no shadows, red scrollbar |
brutalism |
Brutalism 野性主义 | light | 4px black borders, hard 2D shadows, warning-yellow blocks, grain overlay |
dark-glass |
Dark Glass 暗黑玻璃 | dark | Deep navy with blue/violet/cyan ambient glow, frosted code panels, sleek scrollbar |
pixel-retro |
Pixel Retro 像素复古 | dark | Indigo arcade, Press Start 2P headings, CRT scanline + vignette, pixel box-shadows |
Style sources: uiprompt.dev web-styles design prompts; each skin maps the prompt's palette to --dsw-alias-* tokens and its key visual effects to scoped CSS.
How it works
- Skin ≠ theme preference. The stock ThemeRuntime persists only
light/dark/system; a skin id held there reverts on every settings save or run-mode switch. This plugin keeps the active skin in its own persisted flag driving abody[data-dsh-skin-<id>]attribute — nothing automatic can revert it. - The skin owns the scheme. While a skin is active, the base color scheme locks to the skin's design (
colorScheme) so dark skins never render light chrome around dark tokens; picking the default style releases the lock and restores your previous preference. - Palette travels with the attribute: each skin's
--dsw-alias-*tokens are also emitted as plain CSS on that attribute, so colors survive any client-tree rebuild. - Base scheme is independent: 跟随系统 / 浅色 / 深色 switch underneath the skin overlay.
- A skin id picked in the official Settings → Appearance selector is adopted automatically.
Install
# from npm
dsh plugin --profile web add dsh-skin-collection
# or straight from GitHub (prebuilt lib/ committed — no build scripts run)
dsh plugin --profile web add github:NonchalantLudens/dsh-skin-collectionRestart dsh web. Use the 皮肤 button at the sidebar foot to pick a skin; the default style restores the stock look. Skins also appear under Settings → Appearance.
No install-time code execution: the package ships prebuilt artifacts and declares no build scripts.
Structure
lib/client.js— shipped client bundle in the loader's closure-factory format (hand-written; no build step required for pure CSS/DOM skins)lib/index.js— node half (no-op cordis plugin stub)src/client/index.ts,src/skins/— readable source of reference, kept in sync withlib/cordis.patch.yml— inserts the plugin into the web roster on install
Adding a skin
- Append an entry to
EXTRA_SKINS(id,label,theme.tokens, optional Google-Fontsimports, scopedcss) inlib/client.js. - Done — registration, the picker menu, palette emission, and the attribute guard are data-driven.
- Bump the version and reinstall.
Note: all skins' Google-Fonts @imports are hoisted to the top of one combined decoration sheet (CSS requires @import before other rules); keep per-skin imports in the skin's imports array rather than inside its CSS body.