@guowenzhang/dsh-web-design
Web design for DeepSeek Harness: preview and edit HTML elements in the Sidebar
The plugin will be installed here. Keep web if you are unsure.
npx -y @deepseek-ai/dsh plugin --profile web add @guowenzhang/dsh-web-design@0.1.1
Web Design is published as @guowenzhang/dsh-web-design and currently resolves to version 0.1.1. The Hub verifies its manifest and preserves the exact installation source for reproducible installs.
English | 中文
DeepSeek Harness (dsh) is the open-source agent harness from DeepSeek AI, where nearly every capability is a plugin on Cordis. It is in developer preview and iterating fast, so expect compatibility-breaking changes (docs, 0.1.7-alpha.*); this plugin is a standalone third-party package that resolves @deepseek-ai/* from the running host.
There was no way to see a rendered HTML page and adjust it without leaving DSH; this plugin previews .html in the Sidebar, edits style, text, position and deletion, and writes the changes back into the source file.
The Sidebar preview
The Sidebar preview of an open .html file, with the 预览 / 编辑 switch and 保存到文件 in its toolbar.
The element editor dialog The element editor dialog: the selected element's selector, its text, and the style fields it can write back.
npx @deepseek-ai/dsh plugin --profile web add @guowenzhang/dsh-web-design
From the npm registry: https://www.npmjs.com/package/@guowenzhang/dsh-web-design — restart the host afterwards; local checkouts, git sources and troubleshooting are in AGENTS.md.
Opening an .html or .htm file in the Sidebar renders the page in place of the static source view, running the file's own inline CSS and scripts.
The toolbar's two-position switch changes between Preview and Edit without remounting the page. Preview leaves the page's buttons, links, and other click behavior active, so the page works normally. In Edit, a single click selects an element and a double-click opens its floating editor without replacing the page. The frame confirms each mode switch before accepting another click, so a rapid click cannot activate the page under the wrong mode.
Select Edit, single-click the exact element to highlight it, then double-click to open the dialog. For transparent controls covering label text, clicking the text selects the text leaf while clicking the surrounding option selects its box. The dialog's Parent action moves to the containing element, including a group whose border is too thin to target directly. The dialog opens beside the preview when space allows, or along the bottom of a narrow viewport. A draft immediately shows Unsaved in the toolbar; Cancel discards it.
Drag the handle on the selected outline. Block elements move with CSS translate; inline text elements use relative left/top offsets, because browsers do not translate ordinary inline boxes. Save in the dialog keeps the new position; Cancel restores the original inline declarations.
The dialog changes font size, weight, line height, letter spacing, color, background, padding, margin, and corner radius. A saved override applies to the frame immediately and persists with the review.
An element with exactly one non-blank direct text node exposes that text in a field, even when it also has child elements. A parent container cannot replace the text of its descendants or guess between multiple direct text runs. The dialog header identifies the selected tag and CSS selector; compact Parent and Copy actions sit on the right. Copy puts the selected element's CSS selector on the clipboard so it can be shared for a precise change, including when the element has no editable direct text. Save in the dialog changes the frame and keeps the text replacement pending for the file write.
Delete element removes the selected element and its descendants from the preview. The toolbar shows Unsaved until Save to file removes that exact element from the HTML source. Undo deletion restores all pending deletions before they reach the file. Document roots (html, head, and body) cannot be deleted.
Save to file writes the style, text, and deletion edits into the HTML file itself. Until then those edits live in a review file beside the artifact and re-apply on load; the preview never writes the HTML on its own.
Text replacement is limited to elements with one non-blank direct text node; child markup is preserved, and multiple direct text runs are refused. A successful file write clears the Unsaved status for the committed edit.
The plugin itself is Apache-2.0 — see LICENSE and NOTICE. It contains no DeepSeek Harness source: the harness packages are peer dependencies resolved from the running host.
Its runtime dependencies keep their own licenses: parse5 is MIT, and @deepseek-ai/dsh-atomic-write is MIT.