Preface¶
The DeepSeek Harness (DSH) web interface defaults to the system theme tokens. When you want to switch to a fixed visual style without modifying the application source code, the common approach is to manually alter CSS or fork the frontend—this incurs high maintenance costs and is prone to breakage during upgrades.
dsh-theme-endfield takes a different path: as a pure Client-side half-plugin, it only overrides theme tokens and injects a stylesheet, without touching the Host-side code. Below, we introduce what it is, what it can do, and how to install and adjust it.
What It Is¶
dsh-theme-endfield (maintained by ymh0000123) is a web theme plugin for DSH, inspired by the visual style of the Arknights: Endfield official website, categorized under “Fun Skins” in SkillHub. The core visuals feature a creamy paper background, ink-black text, signal yellow accents, and a fully rectangular industrial editing aesthetic.
The plugin is open-source on GitHub (MIT license, currently version 1.0.0 in package.json). It does not modify DSH application code; instead, it leverages Client runtime to override theme tokens and inject styles.
The visual references are from the Endfield official websites: domestic version https://endfield.hypergryph.com and international version https://endfield.gryphline.com.
Design Language¶
The README summarizes the design language in the table below. For the complete color palette, token mapping, and contrast rules, see docs/design-language.md in the repository.
| Dimension | Values |
|---|---|
| Paper Background | Light #e8e8e2 / Dark #101110 |
| Text | Light #101110 / Dark #f5f5f0 |
| Accent Color | Valley Yellow #fff500 (default) or Wuling Cyan #14d0d0, switchable with one click in settings |
| Font | Arial / Helvetica Neue / PingFang SC / Microsoft YaHei, with tnum monospaced digits enabled |
| Border Radius | All 0 (state indicators, avatars, and loading circles retain circular shapes), switchable back to rounded |
Core Features¶
Theme Override¶
After installation, the plugin uses DSH Client’s theme service and styles built-in capability to switch the interface to the Endfield style. The Host half (index.js) is an empty implementation; all logic resides in client.js: token overrides, stylesheet, settings page, and various functional layers.
Ten Configurable Switches¶
The settings entry is Settings > Endfield Theme Settings. There are four groups with ten switches, persisted by localStorage, and text follows DSH language settings (Chinese/English). For details on each switch’s behavior, see docs/features.md.
| Group | Switch | Default |
|---|---|---|
| 01 Theme | Endfield Theme (master switch) | On |
| Theme Color (Valley Yellow / Wuling Cyan) | Valley Yellow | |
| Theme Border Radius (Rectangular / Rounded) | Rectangular | |
| 02 Background | Contour Background | Off |
| Dynamic Contour | On (requires enabling Contour Background first) | |
| Background Watermark | On | |
| Keep Watermark Displayed | Off (requires enabling Background Watermark first) | |
| 03 Animation | Startup Loading Animation | Off |
| 04 Entertainment | Thunder Text | Off |
| Text Entry Animation | Off (requires enabling Thunder Text first) |
Some switches have dependencies: for example, Dynamic Contour requires Contour Background to be enabled first, and Text Entry Animation requires Thunder Text to be enabled first.
Installation and Activation¶
Run the official installation command under the web profile:
dsh plugin --profile web add github:ymh0000123/dsh-theme-endfield
Take effect after restarting or reloading the web profile. After installation, go to Settings > Endfield Theme Settings to adjust switches as needed.
Uninstall:
dsh plugin --profile web rm dsh-theme-endfield
Typical Usage¶
Daily: Install and Adjust Settings¶
- Run the
addcommand above and reload the web profile. - Open Settings > Endfield Theme Settings.
- Switch the master switch, color (Valley Yellow / Wuling Cyan), border radius, as well as background, animation, and entertainment options as needed.
Temporary Trial (Without Installation)¶
The README provides a way to try it via Cordis dynamic plugins, suitable for experiencing before deciding on long-term installation:
- Copy the function body from
apply(ctx) { ... }inclient.js; - Use
cordis_defineto create a new plugin, paste it as Client code (return { apply(ctx) { ... } }), then activate withcordis_run; - Refresh the page to take effect; stopping the plugin on the Run card completely uninstalls it (theme layer and style layer are automatically removed).
Note: client.js depends on the DSH Client runtime’s theme service and styles built-in; it cannot run directly in a standard browser.
Use Cases and Notes¶
Who It’s For
- Users who work long-term in the DSH web interface and want a unified Endfield industrial editing aesthetic.
- Developers who only want to reskin without modifying DSH source code or forking the frontend.
Precautions Before Use
- The plugin runs with the current
dshprocess permissions. Before installation, it’s recommended to read the GitHub repository source code to confirmclient.jsbehavior aligns with expectations and verify the MIT license. - SkillHub (
https://www.skillhub.cn) is an independent DSH plugin community directory, with no official affiliation with DeepSeek / High-Flyer; the directory page is for discovering plugins, but installation still follows thedsh plugincommand in the README. - Some background and animation features (e.g., contours, startup loading animation) increase rendering overhead; if your machine is slow, consider disabling decorative items in groups 02 and 03 first, retaining only theme tokens and colors.
Development and Validation¶
The maintainer provides static validation and test scripts. The theme stylesheet is maintained as a JavaScript template string, and some changes might silently fail while the file remains parseable. Thus, scripts are used to enforce invariants:
node check.js # Stylesheet invariants (template strings, comment balancing, variable definitions, :root pitfalls)
node selftest.js # Reverse validation to ensure check.js catches those issues
npm test # Full validation: colors / settings page / rendering / coverage / performance
Some tests require measuring pixels in a real browser; Chrome must be installed locally. check.js, selftest.js, and several settings page and color-related tests can run purely in-process. See docs/testing.md for details.
Conclusion¶
dsh-theme-endfield transforms the DSH web interface into the Endfield official style with a creamy paper background, ink-black text, and signal yellow accents, controlled by ten locally persistent switches for color, background, and entertainment effects. Installation and uninstallation each require a single dsh plugin command.