Chuyển đến nội dung chính
dsh marketplace

dsh-design-skills

Đã xác minh

@yangdongzhen590/dsh-design-skills · v0.1.0 · MIT

Design aesthetics skill pack for DeepSeek Harness (DSH): 6 styles — dark SaaS, minimal white, neumorphism, brutalism, glassmorphism, Japanese minimal — with runnable landing-page demos. Keeps vibe-coded websites away from the AI look. / DeepSeek Harness 设

Cài đặt

dsh plugin add @yangdongzhen590/dsh-design-skills

Xác nhận layer đã áp bằng dsh --profile default --dump-config — xem hướng dẫn cài plugin.

Mã nguồn

Thẻ

Tác giả

Readme

dsh-design-skills

DeepSeek Harness 设计美学技能包 —— 让 vibe coding 出来的网站摆脱「AI 味」。

English | 中文

模型不缺"怎么建站"，缺"怎么建得好看"。本技能包把经过验证的设计风格提炼成 可执行的规范（token + 组件规则 + 禁用清单 + 验收清单），模型匹配后自动遵循。

MIT License dsh awesome · DSH plugin 在线预览

🖼️ 在线体验全部 10 种风格 → zhaiyateng.github.io/dsh-design-skills

效果预览

同一产品（虚构的 Agent 编排平台 "Relay"）的十种风格效果——这就是本技能包对 vibe coding 产物的实际影响：

dark-saas（深色） apple-minimal（极简白） neo-neumorphism（新拟态） brutalism（粗野主义） glassmorphism（毛玻璃）
dark-saas 落地页演示 apple-minimal 落地页演示 neo-neumorphism 落地页演示 brutalism 落地页演示 glassmorphism 落地页演示
japanese-minimal（日式极简） bento-grid（便当盒） cyberpunk（赛博朋克） vaporwave（蒸汽波） art-deco（装饰艺术）
japanese-minimal 落地页演示 bento-grid 落地页演示 cyberpunk 落地页演示 vaporwave 落地页演示 art-deco 落地页演示

Demo 源码：examples/dark-saas-landing.html · examples/apple-minimal-landing.html · examples/neo-neumorphism-landing.html · examples/brutalism-landing.html · examples/glassmorphism-landing.html · examples/japanese-minimal-landing.html · examples/bento-grid-landing.html · examples/cyberpunk-landing.html · examples/vaporwave-landing.html · examples/art-deco-landing.html

包含的技能

技能 风格 适用场景
dark-saas 深色 SaaS（Linear 式） 开发者工具、数据看板、AI 产品、SaaS 后台
apple-minimal 极简白（Apple 式） 产品官网、落地页、作品集
neo-neumorphism 新拟态 / Soft UI 个人主页、健康/理财 App、演示 Demo
brutalism 粗野主义 / Brutalism 实验性产品、艺术/独立项目、开发者工具
glassmorphism 毛玻璃 / Glassmorphism AI 产品、SaaS 官网、Dashboard、演示 Demo
japanese-minimal 日式极简 / Japanese Minimal 文化/美学类产品、博客、艺术展、和风品牌
bento-grid 便当盒 / Bento Grid 产品官网、功能展示、SaaS 首页、个人主页
cyberpunk 赛博朋克 / Cyberpunk 科技产品、AI 工具、游戏、极客向落地页
vaporwave 蒸汽波 / Vaporwave 艺术项目、音乐/文化向站点、实验性落地页
art-deco 装饰艺术 / Art Deco 高端品牌、奢华酒店、艺术/时尚类站点

安装

dsh plugin --profile web add dsh-design-skills

或本地安装：把本仓库放进 $DSH_HOME/profiles/node_modules/（符号链接）， 在 profile 的 cordis.patch.yml 中插入 dsh-design-skills。

使用

在会话中直接说：

  • 「用深色 SaaS 风给我做一个 AI 产品落地页」→ 自动匹配 dark-saas
  • 「帮我做一个 Linear 风格的数据看板」→ 自动匹配 dark-saas
  • 「做一个苹果官网那种极简的落地页」→ 自动匹配 apple-minimal
  • 「Soft UI 风格的个人主页」→ 自动匹配 neo-neumorphism
  • 「粗野主义风格的开发者工具官网」→ 自动匹配 brutalism
  • 「毛玻璃效果的 AI 产品首页」→ 自动匹配 glassmorphism
  • 「日式极简、禅意风格的品牌站」→ 自动匹配 japanese-minimal
  • 「便当盒布局的产品功能页」→ 自动匹配 bento-grid
  • 「赛博朋克霓虹风格的 AI 工具」→ 自动匹配 cyberpunk
  • 「蒸汽波风格的实验站点」→ 自动匹配 vaporwave
  • 「装饰艺术奢华风格的品牌官网」→ 自动匹配 art-deco

技能通过渐进式披露工作：会话开始时模型只看到技能名与描述， 当任务匹配时才加载完整 SKILL.md（token、组件规则、禁用清单）。

原理

  • 每个技能是标准的 skills/<name>/SKILL.md（YAML frontmatter：name + description 必填）。
  • index.js 以 ctx.skills provider 形式注册本包全部技能（rank 600，与官方内置同级）。
  • 声明 dsh.bundle manifest，可通过 dsh plugin add 一键安装。

路线图

  • 十种风格：深色 SaaS、极简白、新拟态、粗野主义、毛玻璃、日式极简、便当盒、赛博朋克、蒸汽波、装饰艺术
  • 每种风格的完整落地页 demo 代码（可一键复制）+ 宣传截图
  • 场景化工作流 skill：落地页 / 作品集 / 文档站 / SaaS 后台
  • 设计 token 的 Tailwind / CSS variables 双格式输出

合规说明

本仓库的设计规范参考了 MIT 许可的开源项目（awesome-design-md、shadcn/ui）。 所有来源、许可证全文与商标声明见 THIRD_PARTY_NOTICES.md。 本仓库与所列品牌无任何隶属或背书关系。

License

MIT