Anthropic Claude Design 反向工程提示词开源更新

Claude Design 系统提示词

从 Anthropic 的 Claude Design 逆向工程得到的系统提示词。

一套系统提示词与技能库，可将 LLM 转变为一位有主见、注重无障碍、能抵御 AI 垃圾风格的设计协作者。

开源，MIT 许可。将提示词放入任何支持系统提示词的 LLM（Claude、GPT、Gemini、本地模型），并按需搭配程序化技能使用。

这是什么

大多数"设计助手"提示词产出的都是千篇一律的 SaaS 模板式输出——夸张的渐变、emoji 装饰、圆角配左边框的卡片、到处都是 Inter 字体。这套提示词明确拒绝这些模式，并以一套完整的设计哲学取而代之，涵盖：

• 内容纪律（没有填充物——每个元素都有其存在的价值）
• 美学纪律（避免 AI 套路，确定一套配色和基调）
• 视觉层次与节奏（尺寸、颜色、字重、位置、密度、间距比例）
• 无障碍性（WCAG、语义化 HTML、键盘导航、焦点环、动效偏好）
• 交互与反馈（悬停、激活、禁用、聚焦、加载、校验状态）
• 系统化思维（以组件和 token 为核心，而非一次性页面）
• 尊重媒介本身（真正的 CSS Grid、oklch()、text-wrap: pretty、真正的交互式原型）
• 质量优先于数量（深度优先于广度，打磨每一个细节）

外加 14 项程序化技能，智能体可调用它们来完成生产、提取和审查工作。

包含内容

claude-design-system-prompt/
├── claude/                              Claude Code / Claude.ai variant
│   ├── system-prompt.md                 Main system prompt — 20 chapters
│   └── skills/                          14 invokable skills
│       ├── discovery-questions.md       Kickoff question protocol
│       ├── frontend-aesthetic-direction.md  Commit to a look when no brand exists
│       ├── wireframe.md                 Low-fi exploration, 3+ variations
│       ├── make-a-deck.md               Slide presentations in HTML
│       ├── make-a-prototype.md          Interactive clickable prototype
│       ├── make-tweakable.md            Floating tweak panel
│       ├── generate-variations.md       3+ hi-fi variations across axes
│       ├── design-system-extract.md     Pull tokens from sources
│       ├── component-extract.md         Inventory reusable components
│       ├── accessibility-audit.md       WCAG, semantic, keyboard, motion
│       ├── ai-slop-check.md             Gradient / emoji / font / house-style trope detection
│       ├── hierarchy-rhythm-review.md   Size / weight / color + spacing scale
│       ├── interaction-states-pass.md   Hover / active / disabled / focus / loading
│       └── polish-pass.md               Umbrella final-gate review
├── codex/                               OpenAI Codex variant (single-loop, no subagents)
│   ├── AGENTS.md                        Codex auto-discovered entry point
│   ├── system-prompt.md                 Same prompt, adapted for Codex
│   └── skills/                          Same skills, sequential reviews instead of parallel agents
├── README.md                            This file
└── LICENSE                              MIT

如何使用

直接使用系统提示词

将 system-prompt.md 的内容粘贴为任何支持系统提示词的 LLM 的系统提示词。智能体将遵循该设计理念，并在任务匹配时按名称引用相应技能。

将技能作为流程使用

skills/ 中的每项技能都是一个自包含、分阶段的流程。技能名称即触发条件——当用户的请求与某项技能描述匹配时，智能体便加载该技能并遵循其流程。

技能分为三大类：

生产——构建某些东西 discovery-questions · frontend-aesthetic-direction · wireframe · make-a-deck · make-a-prototype · make-tweakable · generate-variations

System — 提取结构 design-system-extract · component-extract

Review — 审查并修复 accessibility-audit · ai-slop-check · hierarchy-rhythm-review · interaction-states-pass · polish-pass

技能可以串联。一个典型的从零开始流程：

discovery-questions → frontend-aesthetic-direction → wireframe → make-a-prototype → polish-pass

一个品牌感知流程：

design-system-extract → generate-variations → make-tweakable → polish-pass

针对你的平台进行适配

该提示词假定的是一个输出 HTML 的设计环境（类似于 Claude.ai 的设计工具）。如果你的目标环境不同——比如 Figma 插件、纯代码助手、纯聊天式设计教练——你就需要调整工作流章节和工具引用。其原则（第 5–16 章）可迁移到任何媒介。

模型校准

claude/ 变体是针对当前 Anthropic 前沿模型（Fable 5 以及 Opus 4.7/4.8 系列）校准的，这些模型更严格地遵循指令，相比早期几代需要更少激进的提示：

• 用条件而非配额。没有“至少问 N 个问题”，没有“关键：你必须”。当前模型会把配额当作字面契约并对其过度触发；该提示词陈述的是采取行动的条件，外加一条针对次要决策的自主条款（选一个合理的选项并注明，而不是发问）。
• 为技能和子智能体设置显式触发条件。 这些模型默认情况下对可选能力的调用意愿偏低，因此每一条技能描述都会写明何时调用它，而验证器委派也有一个显式触发条件（“每次实质性视觉变更之后”）。
• 覆盖优先的审查。 审查智能体会报告所有内容，并附上置信度/严重程度估计，然后由聚合步骤进行筛选。当前的模型会字面理解“只报告重要问题”，从而悄无声息地压制了发现结果。
• 品牌风格防护。 当前模型的默认审美（奶油色背景、衬线展示字体、赤陶色/琥珀色点缀）会被 ai-slop-check（规则 9）检测到，并由 frontend-aesthetic-direction 的四方向协议预先规避。采样参数（temperature）在这些模型上已不复存在，因此视觉多样性必须来自每个变体的显式规格，而非随机性。

在较旧的模型上（Claude Opus/Sonnet 4.6 及更早版本，或非 Anthropic 模型），较为温和的措辞可能触发不足——如果你发现模型跳过了提问轮次或审查，请恢复更强的祈使语气。codex/ 变体单独维护，不受这些说明影响。

设计原则简述

system-prompt.md 中的 20 个章节涵盖：

贡献

欢迎提交 Issue 和 PR。尤其有价值的贡献包括：

• 额外的审查技能（例如文案审查、动效审查、深色模式一致性检查）
• 适配其他环境的提示词（Figma、纯代码、纯终端）
• 提示词应当防御的真实世界失败案例
• 提示词的其他语言翻译版本

请保持相同的操作语气，并避免让提示词变得臃肿——每一章都应证明自己存在的价值，这正是该提示词对智能体所要求的同一标准。

许可证

你可以出于任何目的使用、修改和分发此提示词及技能库，包括商业用途。无需署名，但署名将不胜感激。