dsh-client-ui-dracula

The DeepSeek Harness (DSH) Web interface is functionally complete, but its visual design and layout may not be ideal for extended coding sessions. dsh-client-ui-dracula addresses this. It is a plugin maintained by Erbsen16 that remaps the entire interface to the Dracula color palette and adjusts column width and typography.

Core Features¶

The plugin mainly includes the following adjustments:

Full Dracula color remapping: Overrides all visible elements, including pages, cards, overlays, borders, text, code blocks, JSON trees, scrollbars, and more.
Programming-oriented font stack: Uses programming-oriented fonts for both code and interface text (defaults to Cascadia Mono / Segoe UI Variable Text).
Typography optimizations: Adjusts the main content column width from the default 748px to 1080px, enables horizontal scrolling for code blocks, and increases the height of the tool output area.
Dark mode only: The color scheme is active only in dark mode. Removing the plugin attribute immediately restores the original interface without requiring a refresh; switching back to light mode in settings will not cause color conflicts.

Installation and Enablement¶

Desktop installation can be completed through the GUI:

Open DSH settings.
Go to the “Plugins” page.
Click + Add Plugin in the top-right corner.
Enter the plugin name dsh-client-ui-dracula and confirm.

Web or other profile installations can use the command line:

dsh plugin --profile web add dsh-client-ui-dracula

After successful installation, the plugin will automatically inject styles into the page.

Typical Usage¶

Adjusting Parameters

The plugin provides tunable parameters. Edit the lib/client.js file in the plugin directory and locate the CSS variables in section 0:

'--dracula-content-width: 1080px;'                    /* 正文和输入框宽度 */
'--dracula-code-font: "Cascadia Mono", ...';          /* 代码字体 */
'--dracula-ui-font: "Segoe UI Variable Text", ...';   /* 界面字体 */

After saving, the client HMR automatically reloads the styles.

Temporary Comparison

To compare the effect temporarily, execute the following commands in the browser console:

__dracula.set(false)  // 关闭
__dracula.set(true)   // 开启

Use Cases and Notes¶

Dark mode dependency: The plugin targets dark mode only. In light mode, the official default styles are displayed.
Embedded page limitations: Embedded open platform pages (the extras/ directory) generate styles dynamically via JS, which this plugin cannot override.
Unofficial modifications: The patch under the extras/platform-purple/ directory requires modifying the host program’s app.asar file, making it an unofficial modification that will be overwritten after host program upgrades.
Compatibility: The plugin is written based on the front-end logic of DSH versions 0.2.0-rc.2 and 0.1.7-rc.2. Some detailed rules targeting CSS Module class names with hashes (such as .wSkVaW_root) may become invalid after DSH upgrades.

Summary¶

dsh-client-ui-dracula provides a complete Dracula dark theme for the DSH Web interface through CSS variable remapping and typography adjustments. It is suitable for developers who want to maintain visual consistency and optimize the reading experience in their programming environment.

GitHub repository