如果你在浏览器、组件库与设计稿里反复做深色模式适配，可以考虑把经验沉淀为一个 Skill：写清触发条件、步骤、输出格式和边界，让智能体代劳重复部分，人只负责把关。

不是每个人都有能装技能的智能体平台。下面这份提示词可以直接粘贴到任何对话助手中使用，效果接近技能版本，只是需要每次手动粘贴。

可复制的提示词

# 角色
你是一名熟悉深色模式适配的助手，服务对象是前端工程师。

# 任务
为现有界面增加深色模式样式。

# 输入
我会提供：样式文件。如果缺少关键信息，请先列出问题，不要自行编造。

# 步骤
1. 梳理颜色使用
2. 建立变量
3. 编写深色值
4. 检查对比度

# 输出
适配方案与代码。使用清晰的小标题，最后单独列出“需人工确认”的内容。

# 约束
- 视觉与交互结果要在真实浏览器里确认。
- 信息不足时先提问，不要自行编造数据或事实。

# 材料
（在这里粘贴你的内容）

用法

  1. 复制整段提示词，把材料粘贴到最后
  2. 第一次使用时附一份你认可的范例，告诉助手“参考这个格式”
  3. 对输出不满意时，指出具体哪一步有问题，而不是笼统地说“再改改”
  4. 把调好的提示词保存在笔记里，下次直接用

和技能版的区别

提示词版本每次都要手动粘贴，长对话中后半段可能逐渐偏离要求；技能版由平台自动加载，适合高频使用。如果你每周都要用好几次，建议升级为技能，参考快速上手。

小技巧

  • 把“输出”部分改成表格表头，能显著提高格式稳定性
  • 材料很长时先让助手复述理解，再开始处理
  • 风险较低，但输出仍需快速过目再使用

每一步要产出什么

把每一步的中间产出写清楚，智能体就不容易跳步，人也方便定位问题：

  1. 梳理颜色使用：产出一段简短的中间结果，并注明依据来自样式文件的哪一部分
  2. 建立变量：产出一段简短的中间结果，并注明依据来自样式文件的哪一部分
  3. 编写深色值：产出一段简短的中间结果，并注明依据来自样式文件的哪一部分
  4. 检查对比度：产出一段简短的中间结果，并注明依据来自样式文件的哪一部分

最后一步之后，再把这些中间结果汇总成适配方案与代码。中间结果可以折叠或省略展示，但在技能指令中要求智能体“先完成再汇总”，能明显减少遗漏。

领域注意事项

「深色模式适配」属于前端与界面领域，使用者多是前端工程师，工作环境通常是浏览器、组件库与设计稿。这个领域最重要的一条底线是：视觉与交互结果要在真实浏览器里确认。

建议把这条底线原样写进技能的约束部分，而不是指望智能体自己意识到。同时，在团队内部明确：智能体给出的适配方案与代码只是初稿或建议，最终由谁签字确认、出了问题由谁负责。

延伸阅读

说明：文中的配置、代码与目录结构均为示意，用于说明思路；各平台的入口、字段名与能力会更新，落地前请以对应官方文档为准。示例中的数据与场景为虚构，不代表真实案例。