关于 ui-design-system
面向设计师和开发者的设计系统工具包，用于创建和维护可扩展的系统。脚本可根据品牌颜色生成设计令牌，并支持交付文档与无障碍检查。
主要功能
- 01根据品牌颜色生成调色板
- 02生成排版与间距令牌
- 03设置响应式断点
- 04导出 JSON、CSS 和 SCSS
- 05验证交付物与无障碍要求
适用场景
- 01根据品牌颜色创建设计令牌
- 02为实现准备设计系统资产
安装
复制下面的命令，在终端中运行。
$
npx skills add https:/安装后在 Claude Code 中输入/ui-design-system确认已加载。
附带文件scripts/design_token_generator.py
详细介绍
UI 设计系统工具包
用于创建和维护可扩展设计系统的专业工具包。
核心功能
- 设计令牌生成（颜色、排版、间距）
- 组件系统架构
- 响应式设计计算
- 无障碍合规性
- 开发交接文档
主要脚本
design_token_generator.py
根据品牌颜色生成完整的设计系统令牌。
用法：python scripts/design_token_generator.py [brand_color] [style] [format]
- 样式：modern、classic、playful
- 格式：json、css、scss
功能：
- 生成完整的调色板
- 模块化排版比例
- 8pt 间距网格系统
- 阴影和动画令牌
- 响应式断点
- 多种导出格式
验证
在报告完成之前，请根据请求的品牌颜色、输出格式、无障碍限制和目标实现范围，验证生成的令牌或交接材料。对于脚本用法，请使用具有代表性的输入运行命令，并检查输出的 JSON/CSS/SCSS 是否语法有效且保留了品牌值。
评论
支持 Markdown