dsh-moodboard

dsh plugin --profile web add dsh-moodboard

dsh-moodboard

[English](./README.md) · [中文](./README-zh-CN.md)






A visual reference moodboard for DeepSeek Harness. Collect screenshots and

inspiration images in the Web UI, tag and annotate them, pin the ones that

define your app's visual language, and let the agent read that style guide

before it generates or restyles UI.

The panel is the Warm Sand Studio interface: a warm sand canvas, white

cards, one coral accent, deep warm ink, soft 18–22px radii and pill controls.

It is built from the Harness theme tokens, so light and dark follow the host.

See docs/UI-REDESIGN.md.

Preview

A quick tour after installation:

1. Open Moodboard from the sidebar. The header shows the image and pinned

counts, Add images, Add from link, Paste image, **Copy agent

brief**, shortcut help and the quiet suite star link.

2. Add references by dragging files anywhere on the page, pasting with

⌘V/Ctrl+V, picking files with Add images, or opening Add references

to paste links or search Mobbin/Are.na. Add tags and turn on **Pin imported

references** there.

3. Select a card to open the inspector. Edit its name, tags, notes and source

URL, copy/paste metadata onto another reference, or pin it with the **Style

guide switch. Manage** moves, replaces or removes it.

4. Use the search box and tag chips, open a reference in the lightbox, or

Cmd/Shift-click several cards for the bulk bar. Press ? for shortcuts.

5. Insert the reference directive with the composer's Moodboard button, or

copy a ready-made agent brief from the header.

[Install](#quick-start) · [Requirements](#requirements) · [Agent API](#agent-api) · [Limits](#limits)

Quick start

The fastest path is the Plugins page: Add plugin → dsh-moodboard,

which installs the package and enables the Moodboard bundle. From the CLI:

dsh plugin --profile web add dsh-moodboard

The CLI installs the package; the Moodboard bundle still has to be enabled

on the Plugins page. Restart the Harness (or refresh the Web UI) if the sidebar

entry does not appear.

_{More from this suite: Moodboard · Composer Predictions · Move to Workspace · Workspace Status · Prompt Rewrite}

_{⭐ If this saves you a step, a star helps the next DSH user find it.}

What's new in 0.4

• Warm Sand Studio redesign. Warm sand canvas, white cards, one coral

accent for primary actions, pins and active filters, deep warm ink, 18px

cards / 22px dialogs / 12px inputs, pill buttons and chips, and soft warm

shadows. Light and dark both derive from the host tokens.

• Redesigned Add references dialog. Gradient header, segmented From links

/ Discover tabs, live n / 20 link counter, a real pin setting row with an

explanation, and a sticky footer with the coral primary on the right.

• Redesigned reference inspector. Kicker row with a solid Style guide

pill, 16:10 preview, section labels with trailing rules, grouped move pair,

borderless remove, and a sticky footer whose disabled Save reads as inactive.

• Responsive and verified. The inspector becomes a bottom sheet on narrow

screens; a real-render harness captures the live client.js in light and

dark across page, dialog, inspector, lightbox, bulk bar and phone widths.

Full history: [CHANGELOG.md](CHANGELOG.md).

What you get

• Moodboard panel in the Web UI (sidebar icon) with a coral mark, title,

image/pinned count pills, and one row of actions: Add images, **Add from

link, Paste image, Copy agent brief**, keyboard-shortcut help and the

quiet suite star link.

• Warm Sand Studio styling built from --dsw-alias-* through a local

--mb-* layer: a warm canvas, card surfaces, hairline warm borders, one

coral accent, warm ink, 4px-based spacing and soft shadows. Motion honours

prefers-reduced-motion; focus rings, live regions and labelled controls are

preserved.

• Active style guide hero: pinned thumbnails, a pinned count and the “The

agent reads these images before designing UI” reminder. Click a thumbnail for

the lightbox, unpin in place, and see each reference's top tags.

• Gallery: search across name, tags, notes and source; tag chips with

counts in the same sticky toolbar; drag-to-reorder; Select all; lazy,

paged thumbnails; card hover actions for expand, pin, replace and remove;

pinned badges and a +n tag overflow count.

• Reference inspector: a kicker row with a solid Style guide pill when

pinned, a 16:10 preview, and grouped Details (name, tags, notes, source

URL), Metadata (copy/paste tags, notes and source), Style guide (the

pin switch and what the agent does with it) and Manage (move pair,

replace, borderless remove with inline confirm). The sticky footer shows

…(truncated)