SuperAPI AI 工具集

pencil-ui-design-system-vant

设计与创作

查看项目

更新于 10-16 18:00

技能介绍

用途:在 Pencil 的 .pen 文件中初始化 Vant 4 设计令牌,并创建 Vant 组件总览框架。仅当用户明确同时提到“Pencil”和“Vant”(或“Vant 4”),或由编排技能(pencil-ui-designer)路由 Vant 初始化请求时使用。

主要能力:注册 Vant 设计令牌,包括主色 van-primary-color #1989fa、成功色 #07c160、警告色 #ff976a、危险色 #ee0a24、灰色 #323233,文本色 #323233、#646566、#969799,边框色 #ebedf0,圆角 4px,字号 14px 等;并按 Vant 文档分类创建“Components Overview”框架,涵盖基础、表单、反馈、展示、导航等组件分区。

使用方式:该技能输出 PENCIL_PLAN,由 Agent 依次调用 Pencil MCP 工具:open_document、set_variables、batch_design,可选 get_screenshot。第一步用 mcp__pencil__set_variables 注册令牌,遵循 .pen 文件 schema;第二步用 mcp__pencil__batch_design 创建组件总览框架,使用 Auto Layout,每次调用最多 25 个操作,超出时按分类拆分。

限制:仅在明确提及 Pencil 与 Vant 时使用;令牌值需对照 Vant 主题文档核验;除非要求完全重置,set_variables 使用 replace: false。更多令牌可参考 Vant 主题文档补充。官方文档链接、示例与组件规范见 references 目录下文件。