Preface

The philosophy of DSH is “everything is a plugin,” and the appearance of the Web GUI can also be handled by plugins. If the default theme gets boring after a while and you want to change the style, the common approach is to directly modify page styles: either tweaking Harness source code, which gets overwritten during upgrades; or scattering a bunch of user styles, which is hard to maintain. dsh-skin-digital-arcade turns the entire skin into an independently distributable bundle, injecting it upon installation and reverting it upon uninstallation without touching the source code. Below is an introduction to its features, principles, and installation steps.

What is it

dsh-skin-digital-arcade (Rizen Signal Console) is a digital arcade-style HUD skin for the DeepSeek Harness Web GUI, maintained by RizenHNT. The current version is v0.1.1, and the repository code is distributed under the MIT license.

It is not just about changing a set of colors; it integrates color schemes, pixel fonts, animated HUDs, and interactive feedback into a whole. At the same time, readability is put first—the editor text always remains on the official rendering path.

Core Features

Neon Color Scheme

The skin uses a cyber HUD language with four colors: Cyan #6fffe0, Violet #d28cff, Magenta #ff62bd, and Amber #ffc36b, replacing the default blue and gold color scheme.

Pixel Font

Buttons, titles, and labels use the Fusion Pixel 12px font (OFL-1.1, latin + Simplified Chinese subset, covering all common CJK characters). English, numbers, and Chinese are unified on a 12px pixel grid, ensuring harmonious mixed text.

Animated HUD and Pixel Assets

The animation parts include: background grid drift, hero glow pulsation, sidebar radar/particles, selection item status beacon, input card scanlines, send energy frame animation, bubble hover chroma scan, and bottom HUD status bar.

All pixel assets are procedurally generated and compressed as WebP: arcade city background, data core/fragment sprites, signal mascot sprite sheet, energy FX atlas, and crosshair cursor.

Interactive Feedback System

The page responds to operations like a game interface:

  1. Cyan and violet dual glow when hovering over buttons/links;
  2. Amber hit confirmation when pressed;
  3. Magenta targeting box when focused via keyboard;
  4. Display INPUT // DECODE 01 with RGB separation and brief glitching when an input field is focused.

Custom Cursor

A crosshair cursor (32×32) is applied to interactive elements, while the text cursor is restored in text input areas.

Readability and Settings Panel Compatibility

The body text of the conversation uses system fonts; input fields have static grids with bottom scanlines and no distracting animations. When the settings panel is opened, the skin temporarily elevates the sidebar layer and removes clipping, does not use backdrop-filter, and keeps fixed panels full viewport.

How it works

The plugin consists of three parts:

  1. cordis.patch.yml inserts a line for the host plugin skin-digital-arcade;
  2. index.js registers the /skin-assets/* prefix route upon application to serve fonts and sprites within the package (including path traversal protection), and taps into the index rendering to inline skin.css into <head> (with a data-plugin marker);
  3. skin.css is a pure declarative layer: it overrides --dsw-* tokens and stable DOM properties without touching editor layout properties.

The plugin itself is JavaScript + CSS + static resources, requiring no separate compilation.

Installation and Enablement

First, install the plugin. It supports two methods: from GitHub or a local directory:

# Install from GitHub
dsh plugin --profile web add https://github.com/RizenHNT/dsh-skin-digital-arcade

# Or install from a local directory
dsh plugin --profile web add /path/to/dsh-skin-digital-arcade

If using the Harness source code version of CLI (pnpm dsh ...), you need to build Harness first according to the official documentation; the installed CLI (dsh) does not require this.

After installation or update, it is recommended to restart the current dsh web process to ensure all new bundles, resource routes, and index injections are loaded:

dsh --profile web

Uninstallation and Development Self-Check

Uninstallation only requires a single command to restore the default theme:

dsh plugin --profile web remove dsh-skin-digital-arcade

Developers can run the plugin self-check to simulate the webServer and verify resource routing, path protection, and CSS injection:

node test-plugin.mjs

If you need to regenerate skin.css (optional, to convert resource paths from personal.css in the Harness repository):

python tools/gen-skin-css.py

This script requires personal.css in the Harness source tree as input; if you use the ready-made skin.css from the repository directly, you do not need to run this script.

Applicable Scenarios and Notes

It is suitable for users who want to change the DSH Web GUI to a complete visual style and accept the pixel arcade aesthetic. After following the steps above, it takes effect after installation and restart; if you don’t like it, you can uninstall and restore it at any time.

Two notes:

  1. The plugin runs with the permissions of the current dsh process. It is recommended to check the source code and license before installation. The code, asset packaging, and documentation of this repository are MIT-licensed; the pixel font Fusion Pixel (© TakWolf) is OFL-1.1.
  2. Version changelog: v0.1.0 was the initial release (Neon HUD theme, pixel font, animated sprites, interactive feedback, custom cursor); v0.1.1 added sidebar session tree pixelation, full CJK pixel font, and updated preview images.

Conclusion

dsh-skin-digital-arcade turns outfit changing into an installable, uninstallable, source-code-free independent bundle. You can give it a try when you want to change the look of the DSH Web GUI.

  • GitHub：https://github.com/RizenHNT/dsh-skin-digital-arcade
  • Community Directory Page：https://www.skillhub.cn/plugins/RizenHNT/dsh-skin-digital-arcade （Community independent site, no official affiliation with DeepSeek / Huafan, page information is subject to actual data）