Preface

When using DeepSeek Harness Web for debugging or development, the default send button icon is quite generic. If you want to replace the main send button with the official DeepSeek whale logo, you can use this plugin.

Core Features

  1. Icon replacement: Replaces the main send button icon in the chat input area with the whale logo.
  2. Behavior preservation: Does not change the actual interaction logic of buttons such as send or stop; only modifies the appearance.
  3. CSS implementation: Uses the CSS mask property to overlay the official whale graphic, with the color following the button text color (currentColor).
  4. Theme adaptation: Supports light and dark themes, and the icon color switches automatically.
  5. Precise override: Pure browser-side style override with zero dependencies; it does not affect other icons such as the stop button or queue button.

Installation and Activation

This plugin is installed as a local package. Essentially, it runs pnpm add and writes the plugin to dsh.profile.bundles.

# 在 web profile 下安装
dsh plugin --profile web add <路径>/dsh-external-ds-whale-send-button-0.1.0.tgz

# 验证配置是否写入
dsh --profile web --dump-config

# 重启服务使配置生效

Dynamic Usage (Temporary)

In a “Create Mode” session, you can temporarily load this plugin by defining a plugin object in lib/client.js and calling cordis_run. Note that this method will lose the plugin after the service is restarted.

Uninstallation

dsh plugin --profile web remove @dsh-external/ds-whale-send-button

How It Works

The plugin is registered as a client package in the browser roster. During initialization, it injects a <style> element tagged with data-plugin-css into document.head.

  1. Targeting: Uses the [data-composer-card] selector together with the unique d prefix of the send arrow path to precisely identify the main send button.
  2. Hiding: Hides the original send arrow SVG element.
  3. Overlaying: Uses the CSS mask property to overlay the official DeepSeek whale graphic (the path is taken from the favicon.svg bundled with dsh).
  4. Color: Sets background-color: currentColor so that the whale color changes with the button text color.

Customization

If you need to adjust the icon style, modify the parameters in lib/client.js:
- width/height: Sets the icon size (default is 16px).
- background-color: Sets a fixed color (such as DeepSeek blue).
- mask: Adjusts the icon scaling method.

After modifying, repackage and update using dsh plugin --profile web add.

Notes

  • Supports only the web profile.
  • Installing from a local package requires restarting the service to take effect.
  • Dynamically loaded plugins are lost after a restart.

Conclusion

This plugin uses pure CSS to implement UI customization. It is suitable for developers who need to strengthen DeepSeek brand recognition in the DSH Web interface.