SuperAPI AI 工具集

moai-foundation-uiux

设计与创作

查看项目

更新于 10-16 07:26

技能介绍

用途:为构建现代 UI 组件库与可访问的企业级界面提供统一基础,覆盖设计令牌、组件架构、无障碍、图标与主题五大模块。

主要能力:设计系统方面支持 W3C DTCG 2025.10 令牌结构、Style Dictionary 4.0 转换与 Figma MCP 设计到代码流程;组件架构采用原子设计(Atoms→Molecules→Organisms),结合 React 19、Vue 3.5、shadcn/ui 与 Radix UI 无样式可访问原语;无障碍遵循 WCAG 2.2 AA/AAA,含键盘导航、屏幕阅读器优化与 jest-axe 自动化测试;图标覆盖 10+ 生态(Lucide、React Icons 35K+、Tabler 5900+、Iconify 200K+),强调 tree-shaking 与包体积优化;主题基于 CSS 变量,支持明暗模式、系统偏好检测与品牌定制。

使用方式:初始化设计令牌后运行 npm install --save-dev style-dictionary 与 npx style-dictionary build;组件库可用 npx shadcn-ui@latest init 及 npx shadcn-ui@latest add button form dialog;图标按需安装如 npm install lucide-react、npm install @iconify/react、npm install @tabler/icons-react;主题通过 CSS 变量与 ThemeProvider 配置。

适用场景:搭建组件库、设计令牌架构、无障碍合规、图标系统集成与可定制主题。

限制:资料未提供具体收费、价格与平台支持信息;部分版本号与工具为资料所述,实际以官方为准。