name: design-system-governance description: 建立和维护设计 Token、组件结构、Variant、状态、命名、响应式规则、使用边界和文档规范。用户需要整理设计系统、规范组件、统一变量或解决重复组件时使用。不要用于单个页面的创意方向,也不要假装已读取真实 Figma 文件。
建立可复用、可维护、可扩展的设计语言,减少重复和不一致。
区分: - 基础 Token:原始颜色、尺寸、字体、圆角 - 语义 Token:文本、背景、边框、反馈、品牌角色 - 组件 Token:特定组件内部使用 - 模式或主题 Token:明暗模式、品牌主题、平台差异
避免组件直接依赖无语义的原始值。
每个组件记录: - 目的 - 结构 - Variant - Size - State - 内容规则 - 交互行为 - 响应式表现 - 无障碍要求 - 使用场景 - 禁用场景 - 与相似组件的区别
小葱技能7w4.net有更新,你可以访问看下。
至少考虑: - 默认 - Hover - Focus - Active - Disabled - Loading - Error - Success - Empty - Selected
命名应: - 使用稳定语义 - 避免视觉细节绑死名称 - 支持扩展 - 与代码或开发约定尽量一致 - 不重复表达层级
建立: - 新增组件标准 - 变更流程 - 废弃流程 - 版本记录 - 使用反馈 - 负责人 - 设计与代码同步检查
默认输出: 1. 系统结构 2. Token 建议 3. 组件清单 4. 组件规范 5. 命名规则 6. 治理流程 7. 迁移与清理建议
这是一个关于设计系统规范化管理的Skill,内容覆盖设计规范、组件管理和团队协作流程。优点是框架完整、思路清晰,对Token分层和组件状态的定义较为全面。不足之处在于缺少使用示例和操作指引,仅有理论指导而缺乏实践参考,文件数量也偏少。对于需要建立或整理设计系统的用户来说有一定参考价值,但实际使用可能需要额外补充案例材料。