sdesign-design

Installation
SKILL.md

SDesign — 去 AI 味设计系统库

用户要做"好看的东西"时,不要凭默认审美直接写(那会是 AI 烂味:居中大标题 + 三张一样的卡 + 紫蓝渐变 + emoji + 空话)。改走这套流程。本库以网页/落地页为主(token 是 CSS 单位)。

流程(三步)

  1. 选美学 —— 按用户的氛围词或他点名的大牌,从下表选一个家族,再进 aesthetics/<家族>/ 选一个设计系统(每族有多个,见目录)。
    • 用户说"科技感/开发者/暗色" → tech-dark;说"像 Linear" → tech-dark/linear-app
    • 用户说"温暖/有人味/像 Claude" → warm-humanist/claude。说"高级/像 Apple" → minimal-editorial/apple
    • 不确定就问一句,或默认挑该家族第一个设计系统。
  2. 读设计系统的 prompt.md —— aesthetics/<家族>/<设计系统>/prompt.md。里面有精确 token + 本美学特别说明 + 内联的去AI味规则。严格照它的 token,一个强调色都不许改。
  3. 做 + 自检 —— 默认输出单文件 HTML + 内联 CSS(除非用户指定 React/Vue/Tailwind),加 <meta name="viewport"> + 基本 reset。做完可跑 node scripts/audit.mjs <产出> 查机械违规;主观品味对照该设计系统 reference.png

铁律(任何美学都遵守)

rules/anti-slop.md 是总规矩,已内联进每个 prompt。核心:只用 token 给的颜色、一个强调色、字体不可获取就换 Google Fonts 公开版、文案别空话、信息密度/CTA 按页面类型给、版式别东倒西歪。

⚠️ 规则凡与某美学冲突,以该设计系统 prompt.md 里的「本美学特别说明」为准:大胆彩色可用 emoji/插画/硬边/故意"丑";数据密集一屏多信息、多 CTA;暖色人文就该衬线大留白;电影暗调就该大尺度渐变 + 超大字。

Installs
3
GitHub Stars
35
First Seen
Aug 2, 2026
sdesign-design — simonlin1212/sdesign