DSH Skin Studio

English | 中文

DSH Skin Studio is a visual, local-first skin authoring studio for DeepSeek Harness Web. It associates an installed theme, absorbs its recognized official design tokens, previews light and dark modes, audits text contrast, and exports an installable v2 skin asset archive.

What it does

• Registers a first-level Skin Studio section in DSH Web settings.
• Reads the installed catalog from Skin Center and associates a project with an existing theme without copying its code or remote resources.
• Edits light and dark palettes, semantic surface radius, density, panel opacity, and a reduced-motion profile with a responsive live specimen.
• Accepts an optional local PNG, JPEG, or WebP background after size, MIME, and magic-byte validation.
• Saves the structured project draft in browser local storage and supports project import and export.
• Produces a standard v2 ZIP containing skin.json, skin.css, bilingual documentation, generated previews, and the optional local image.

Install

Install directly from the public GitHub repository:

dsh plugin --profile web add github:zhangguiping-xydt/dsh-skin-studio

Restart dsh web once after installation, then open Settings → Skin Studio. The plugin supports DSH >=0.1.1-rc.2 <0.2.0 and requires the standard DSH Web settings surface.

Workflow

1. Fill in the skin identity and author fields.
2. Select an installed base theme and choose Associate and absorb palette.
3. Refine both light and dark palettes while checking the live specimen and WCAG contrast result.
4. Optionally select a validated local background and tune surface, motion, and background controls.
5. Export the ZIP, extract its directory under $DSH_HOME/skins/, refresh DSH Web, and apply it from Settings → Skin Center.

Theme association copies only recognized --dsw-* color token values from Skin Center's transformed stylesheet endpoint. It does not copy hooks, free selectors, fonts, background assets, or remote URLs; the exported manifest records the relationship with a based-on-<id> tag and attribution text.

Config

The plugin has no host-side configuration, API route, model access, or filesystem write. Its draft uses the browser key dsh-skin-studio:draft:v1; imported project JSON is capped at 128 KiB, and background images are capped at 8 MiB.

All authoring is client-side. The only DSH request is a read-only fetch of /api/skin-center/v2/catalog and the selected installed skin's transformed stylesheet. If Skin Center is unavailable, the studio remains usable with the built-in Official Default palette.

Security model

• The host half is inert: there are no write routes, subprocesses, model calls, credentials, telemetry, or profile mutations.
• Imported projects are normalized into a fixed schema; IDs, versions, tags, colors, numeric ranges, and source links are fail-closed or clamped before export.
• Uploaded assets permit only PNG, JPEG, and WebP and require both an allowed MIME type and matching magic bytes; SVG, HTML, video, and remote media are rejected.
• Theme stylesheets are treated as untrusted text. The studio extracts bounded --dsw-* declarations and accepts only hex colors into its palette; it never evaluates or re-exports the source stylesheet.
• Export paths are fixed by the studio, and exported skins contain no hooks.mjs, patches.css, @import, protocol URL, or executable content.

Security reports should use GitHub's private vulnerability reporting for this repository rather than a public issue.

Known limitations

• Theme association imports the official color-token subset only; complex art, typography, structural patches, and runtime behavior intentionally stay with the source theme.
• Background images are held in memory for the current page and are not saved in local storage; select the image again after a reload before exporting it.
• The live specimen models the stable DSH semantic surfaces but is not a pixel-for-pixel copy of every installed DSH plugin.
• Export validates the Studio contract but official-market publication still requires the DSH Market review and preview workflow.

Development

pnpm install
pnpm run typecheck
pnpm test
pnpm run test:coverage
pnpm run build
pnpm run check

The test suite covers project normalization, color and contrast behavior, catalog parsing, token absorption, archive structure, asset validation, local persistence, settings registration, and primary UI flows.

License

MIT