Introduction

DeepSeek Harness (DSH) uses the “everything is a plugin” architecture. For developers or users, customizing the appearance of DSH Web is a common requirement. Manually writing CSS variables or maintaining the ZIP asset structure can be cumbersome. dsh-skin-studio provides a local-first, visual skin-building workbench that lowers the barrier to skin customization and ensures the exported assets are compliant.

What It Is

dsh-skin-studio is a plugin developed by the maintainer zhangguiping-xydt. It registers a top-level “Skin Studio” entry directly in the DSH Web settings panel. The plugin runs in the browser and is responsible for reading installed themes in Skin Center, extracting official design tokens, and providing visual editing and export functionality.

Installation and Activation

Installing this plugin requires the DSH command-line tool.

dsh plugin --profile web add github:zhangguiping-xydt/dsh-skin-studio

After installation, restart the dsh web service and open Settings → Skin Studio to use it.

Core Features

The plugin primarily provides the following capabilities:

  • Theme association and token absorption: Reads the Skin Center directory and associates installed themes. It automatically extracts and absorbs official design tokens (limited to --dsw-* color tokens) without copying theme code or remote resources.
  • Visual editing: Supports editing light and dark palettes, semantic surface radius, density, panel opacity, and reduced motion profile.
  • Real-time preview and review: Provides live preview samples, supports switching between light and dark modes, and can review whether text contrast meets WCAG standards.
  • Background processing: Accepts local PNG, JPEG, or WebP background images (MIME type and magic-byte validation required) and supports saving project drafts using local storage.
  • Asset export: Generates a standards-compliant v2 skin ZIP asset archive containing skin.json, skin.css, bilingual documentation, generated previews, and an optional local background image.

Typical Usage

After installation, you can create or modify a skin using the following steps:

  1. Fill in the identity information: In the plugin interface, fill in the skin name, ID, and author fields.
  2. Associate a theme: Select an installed base theme and click “Associate and Absorb Palette”.
  3. Adjust the colors: While checking the live preview samples and WCAG contrast results, adjust the light and dark palettes.
  4. Fine-tune details: Optionally select a validated local background and adjust the surface radius, motion, and background controls.
  5. Apply the skin: Export the ZIP file, extract its directory to $DSH_HOME/skins/, refresh DSH Web, and apply it in “Settings → Skin Center”.

Notes and Limitations

When using this plugin, note the following:

  • Local storage: Project drafts are saved in the browser’s local storage. Background images are kept only in the current page memory and must be selected again after refreshing the page.
  • Import limits: Imported project JSON is limited to 128 KiB, and background images are limited to 8 MiB.
  • Association scope: Theme association copies only recognized --dsw-* color token values, and does not copy hooks, free selectors, fonts, background assets, or remote URLs.
  • Runtime environment: The plugin has no host-side configuration, API routes, model access, or file-system write permissions. Its security model relies entirely on the browser sandbox.

Conclusion

dsh-skin-studio provides a standardized set of skin-creation tools for the DSH ecosystem. Through local, visual operations, it simplifies the skin development workflow while ensuring the structural security of exported assets through contract validation and token restrictions. This plugin is a community contribution; the related catalog and source code are available at the links below.