用途
该技能用于初始化一套基于 Vant 规范的界面设计系统。其目标有两部分：一是在 .pen 文件中建立全局色板与设计令牌；二是创建初始的组件库画布（Component Overview）。
使用前提与触发条件
使用该技能存在明确约束：仅在用户明确提及“Pencil”和“Vant”（或“Vant 4”）时，或在编排 Pencil 设计系统初始化任务时使用。
主要能力
该技能输出一个 PENCIL_PLAN，随后由 Agent 按顺序调用 Pencil MCP 工具：open_document、set_variables、batch_design，并可选调用 get_screenshot。
第一步：初始化变量（set_variables）
通过 mcp__pencil__set_variables 注册 Vant 设计令牌，遵循 .pen 文件 schema。资料中明确给出的令牌包括：
- 主色与语义色：van-primary-color: #1989fa、van-success-color: #07c160、van-warning-color: #ff976a、van-danger-color: #ee0a24、van-gray-color: #323233。
- 文本与边框：van-text-color: #323233、van-text-color-2: #646566、van-text-color-3: #969799、van-border-color: #ebedf0、van-border-radius: 4px。
- 字体：van-font-size-md: 14px。 如需更多令牌，可从 Vant 主题文档中补充。
第二步：创建组件概览结构（batch_design）
通过 mcp__pencil__batch_design 创建一个“Components Overview”画布，并按 Vant 文档的分组组织各区块：
- 基础（Basic）：Button、Cell、Icon、Image、Layout、Popup、Space、ConfigProvider。
- 表单（Form）：Calendar、Cascader、Checkbox、DatetimePicker、Field、Form、NumberKeyboard、PasswordInput、Picker、Radio、Rate、Search、Slider、Stepper、Switch、Upload。
- 反馈（Feedback）：ActionSheet、Dialog、DropdownMenu、Loading、Notify、Overlay、ShareSheet、SwipeCell、Toast。
- 展示（Display）：Badge、Circle、Collapse、CountDown、Divider、Empty、ImagePreview、Laziness、List、NoticeBar、Progress、Skeleton、Steps、Sticky、Swipe、Tag。
- 导航（Navigation）：ActionBar、Grid、IndexBar、NavBar、Pagination、Sidebar、Tab、Tabbar、TreeSelect。 组织画布时使用 Auto Layout。每次 batch_design 调用最多执行 25 个操作。
使用方式
该技能并不直接执行设计操作，而是输出 PENCIL_PLAN，由 Agent 依序调用 Pencil MCP 工具完成：先打开文档，再设置变量，然后批量构建设计，最后可选截图确认。
最佳实践
- 对照 Vant 主题文档核验令牌取值。
- 除非明确要求完全重置，否则 set_variables 使用 replace: false。
- 组件概览画布使用 Auto Layout。
参考资料
资料中列出以下参考文件：references/contract.md（设计令牌与组件命名）、references/official.md（官方文档链接）、references/examples.md（示例 PENCIL_PLAN）、references/components.md（组件规范）。
限制
该技能仅适用于 Pencil 与 Vant/Vant 4 的场景；资料未提供具体的安装命令、收费方式、价格或效果说明，这些信息暂未提供。