dsh-theme-songgrid
Song-dynasty-inspired theme for the DSH web UI: a light "rice paper" and a dark "night ink" variant, Ru celadon carrying interactive states while kiln copper is reserved for blockquotes, plus a 4pt spacing scale and a 46-glyph mask icon set.
Install
dsh plugin --profile web add dsh-theme-songgrid
Sandbox test results
| Stage | Result |
|---|---|
| 1 install | ✓ |
| 2 list | ✓ |
| 3 mount | ✓ |
| 4 boot | — |
Four stages run in an isolated sandbox: install (network on) → list → mount → boot (last three with no network).
README
宋律 · Songgrid
宋代美学 × 瑞士国际主义 —— 给 DeepSeek Harness Web UI 的一套主题。
中文 ｜ [English](README.md)
宣纸 · 浅色 · 夜墨 · 深色
 · 
两个变体的实机截图（侧栏是定员八席看板）。卡片区域已打码。
为什么是「宋律」
宣纸的暖白、汝窑的天青、朱砂的警醒 —— 加上瑞士国际主义的尺度纪律：4pt 间距阶、2/4px 圆角、字号与行高严格对应。
不是把古风贴到界面上，而是让传统色各自落在合适的功能位上。
两个强调色，两个职责
整套主题里唯一一处"看起来像同一个角色、其实必须分开"的决策：
角色 · 色 · 对比度（宣纸底） · 落点
功能色 · 汝窑天青 · #3A7284  · 4.91 : 1 ✓ AA · 按钮 · 焦点环 · 选中态 · 链接
编辑性强调 · 窑铜 · #9A6B50  · 4.19 : 1 · 引用块 · 标记
天青过 WCAG AA，能承担"能不能点、选没选中"；窑铜不过正文 AA，所以它只做"值不值得多看一眼"。
两者色相相隔 174°，几乎是对比色 —— 它们从来不是同一个角色的两个候选。
两个变体
变体 · id · 气质
宣纸 · song-grid-xuanzhi · 宣纸暖白 × 汝窑天青 × 朱砂
夜墨 · song-grid-yemo · 冷蓝黑 × 提亮天青
跟随系统 · system · 随宿主深浅色自动切换
色板
宣纸 · 浅色
角色 · 值 ·
纸底 · #F7F5EF · 
表面 +1 · #FBFAF6 · 
表面 +2 · #F0EDE4 · 
叠层 · #E7E3D8 · 
细线 · #DDD8CB · 
主文 · 墨 · #26221C · 
次级文字 · #5C554A · 
三级文字 · #8B8478 · 
品牌 / 功能 · #3A7284 · 
编辑性强调 · #9A6B50 · 
成功 · #4E7A5A · 
警告 · #B0823A · 
朱砂 · 错误 · #B5453C · 
夜墨 · 深色
角色 · 值 ·
夜墨底 · #10151A · 
表面 +1 · #191F26 · 
表面 +2 · #1D242B · 
主文 · #E8E3D6 · 
次级文字 · #A8A193 · 
三级文字 · #7A7468 · 
品牌 / 功能 · #7FB4C4 · 
错误 · #D07A70 · 
深色地是冷蓝黑而不是暖黑 —— 它和天青是配套调过的，换暖黑等于整套深色重调一轮。
排版
- 中文走宋体（
Noto Serif SC），拉丁走无衬线 —— 两边各归各位，绝不混用 - 字号与行高成对定义，正文、次级、说明各一档
- 强调不靠加粗堆叠，靠颜色角色（见上文的天青 / 窑铜分工）
结构层
主题分三层，其中两层与颜色正交 —— 以后调色，它们一行都不用改：
层 · 内容 · 含颜色
STRUCTURE_CSS · 间距阶（4pt grid + 用途别名）· 圆角 2/4px · 行高 4 档 · 动效 5 时长 3 曲线 · 焦点环 · 图标尺寸 · 否
ICON_CSS · 46 个 Lucide mask 图标，currentColor 自动跟随 · 否
SEMANTIC_CSS · 强调角色分工（--sg-accent-functional / --sg-accent-editorial） · 是
安装
dsh plugin --profile web add dsh-theme-songgrid
装好后刷新页面，进入 设置 → 通用 → 主题，选择「宋律 · 宣纸」「宋律 · 夜墨」或「跟随系统」。选择会持久化在 song-grid-theme settings namespace 里（= 宿主插件条目的 id）。
入口决定能不能跨浏览器。 DSH 客户端只在页面 hostname 是localhost/::1/127.x时把设置写回宿主（dsh-client-connection的isLoopbackHostname）；用dsh.localhost、内网域名或反向代理域名打开时，整份 settings 会降级成浏览器进程内的memory—— 表现就是"选了主题，刷新又回去了"，而且官方主题偏好、语言、通知设置也一样不落盘。想让选择跨浏览器/跨机器记住，就用http://localhost:8080/（或http://127.0.0.1:3080/?token=…）打开；只想在本浏览器记住的话，用哪个入口都行（插件自己有一份 localStorage 镜像）。
兼容性
- 需要 DSH ≥ 0.2.0-rc.2（
@deepseek-ai/dsh），验证于 0.2.0-rc.2 —— 还在 0.1.5-rc.2 请装dsh-theme-songgrid@0.1.0 - 通过宿主 design token 覆盖实现，不改宿主源码、不写裸值
- 与 DeepSeek 官方无隶属关系（Not affiliated with DeepSeek）
移植笔记（0.1.5-rc.2 → 0.2.0-rc.2）
settingsScope被移除：主题偏好的 scope 现在是ctx.configForms.get("songgrid")（快照仍是{ status, value }）- 构建产物
lib/client.js必须按包名注册在__ModuleLoader__.load({ id })里 —— 任何改名后都要重建 bundle，否则启动会以duplicate factory registration中断
开发
# 本仓库结构 lib/index.js host 半边：注册 songgrid settings namespace lib/client.js 浏览器半边：主题 token + 三层 CSS + 主题选择器 assets/ 青绿山水背景（ink / ink-night / celadon）
- 改结构层：token 集中在
:root，加档位只动那一处；新样式按角色取var(--sg-gap-)/var(--sg-radius-)，别写裸值 - 用图标：
<span class="sg-icon sg-icon-check"></span>，46 个字形见ICON_CSS；尺寸用.sm/.lg/.xl或--sg-icon-size - 扩编辑性强调：
SEMANTIC_CSS里已有--sg-accent-editorial，加落点即可 —— 唯一要求是不要落到交互控件上，那是功能色的位
License
MIT
Rendered from the README published on npm. Formatted only, not edited.
Versions
Published on npm:：8，最后更新 2026-10-16