用途：识别可复用的模式、组件与设计令牌，将其抽取并整合进设计系统，以实现系统性复用。目标是建立受约束的系统，减少未来的设计决策并保持界面一致，而不是收录代码库中的每个值。
主要能力：发现设计系统与组件库结构、命名约定、令牌结构与导入导出约定；识别重复组件、硬编码值、不一致变体、可复用布局与交互模式，以及团队反复重解的问题；评估抽取价值（是否使用 3 次以上或可能复用、是否提升一致性、维护成本与收益）；制定抽取计划，包括组件、令牌、系统边界、变体、命名约定与迁移路径。
使用方式：必须先阅读 frontend-design 并遵循其 Context Gathering Protocol，复用已有上下文，仅就有影响的缺口提问。若项目已使用 shadcn/ui 等库，优先抽取本地包装、可复用组合与文档化模式，不要用冗余本地副本替换上游原语；好的抽取通常位于库原语之上的一层，例如产品特定的操作栏、筛选面板、设置区块或空状态模式。抽取时提供清晰 props API 与合理默认值、变体、无障碍支持（ARIA、键盘导航、焦点管理）及文档示例；令牌需命名清晰（原始与语义）、层级合理、说明使用时机，并对间距、排版、颜色、圆角、阴影建立受约束的尺度。随后系统化替换现有用法、测试视觉与功能一致性、删除死代码，并更新组件库、令牌文档、示例与 Storybook 等目录。
限制与禁止：不要抽取一次性、上下文特定的实现；不要创建过于通用而无用的组件；不要忽略既有设计系统约定；不要跳过 TypeScript 类型或 props 文档；不要为每个值创建令牌；不要把不一致变成令牌目录而非简化系统。若不存在设计系统，须先询问再创建，并确认首选位置与结构。设计系统应增量成长，只抽取当前明确可复用者。