Introduction

The DeepSeek Harness (DSH) Web interface displays the text “deepseek harness” by default in the upper-left corner of the sidebar. For scenarios that require displaying a specific project name or company brand, this is a pain point. The dsh-custom-logo plugin is designed to address this issue by allowing users to replace the brand identifier in place, without relying on floating components, and with minimal intrusion into the interface layout.

What Is This

dsh-custom-logo is a standalone DeepSeek Harness plugin (profile-bundle type), maintained by user 189-sketch. Its core purpose is to replace the default-rendered <BrandWordmark> and <FishLogo> in DSH, support custom images or text, and provide a non-intrusive settings experience through an inline configuration handle.

Core Features

The plugin provides the following capabilities:

  1. Three Rendering Modes

    • Default: No replacement is performed, and the original DSH style is preserved.
    • Image: Upload an image (PNG/SVG/JPG), with a client-side size limit of ≤ 256KB.
    • Text: Enter custom text, with style adjustments supported.

  2. Inline Configuration Handle

    • Hover over the brand identifier in the upper-left corner, and a faded ⚙ symbol appears on the right.
    • Click the symbol to open the settings panel, which automatically closes after the operation is complete.

  3. Style Control

    • Alignment: Left, center, and right alignment are supported.
    • Font Size: Adjustable with a 10–48px slider; double-clicking the slider triggers “auto-fit” mode.
    • Color Picker: Available only in Text mode.

  4. Persistence and Compatibility

    • Settings are saved via localStorage and automatically restored after refreshing the page, without requiring re-login.
    • Collapsed-Safe Mode: When the DSH sidebar is collapsed into the rail state, the plugin automatically removes custom content to ensure the toggle button is not obscured.
    • Shadow DOM Isolation: The settings panel styles are isolated within a Shadow DOM and do not pollute the DSH main interface styles.

Installation and Activation

The plugin can be installed with a single command.

dsh plugin --profile web add link:/path/to/dsh-custom-logo

After installation, if the DSH Web process is running, restart the process or hard-refresh the browser (Ctrl+F5) to clear the client-side cache and load the new plugin.

Typical Usage

  1. Open Settings
    Hover the mouse over the “deepseek harness” brand identifier in the upper-left corner of the DSH interface until the ⚙ symbol appears on the right.
  2. Select a Mode
    Click ⚙ to open the settings panel. Select a mode in the panel:
    • Default: Close the panel and restore the original state.
    • Image: Click the upload area, select a local image (≤256KB), and set the alignment.
    • Text: Enter the brand text, then set the color, font size, and alignment.
  3. Verify the Effect
    Configuration changes take effect immediately. To ensure it works correctly in the collapsed state, you can collapse the sidebar and check whether the toggle button on the rail is clearly visible.
  4. Reset
    To restore the default state, click the “Reset” button in the settings panel.

Notes and Limitations

  • Rendering Latency: DSH’s internal rendering mechanism may cause the brand button to briefly disappear during re-rendering. The plugin mitigates this issue by reusing elements through a singleton pattern, but about one second of invisibility may still occur after initial loading.
  • Storage Scope: Settings are stored in localStorage and isolated by browser profile. They cannot be shared across different browsers or profiles.
  • Image Size: The client enforces the limit via <input type="file">, supporting images up to 256KB. Files exceeding this limit will be truncated.
  • Runtime Environment: The plugin runs only in the browser and does not involve Node.js or SSR environments.
  • Production Build: In development mode, you can use pnpm run watch, but in production there is no file watcher. After modifying source code, you must manually run pnpm run build.

Summary

dsh-custom-logo is a lightweight UI customization tool suitable for developers who need to display specific brand information in the DSH sidebar. Using inline configuration and Shadow DOM technology, it provides a flexible visual replacement solution without breaking the original interaction logic.