Agent Skills Hub

components-build

根据 components.build 规范构建现代化、可组合且易于访问的 React UI 组件。适用于设计系统、组件库及可重用 UI 架构的开发与维护。

pencil-ui-design

使用 Pencil MCP 进行工业级 UI 设计的完整工作流与组件库，包含颜色、字体、间距与阴影的标准化设计规范。

figma-design-to-code

使用 TemPad Dev MCP 将 Figma 设计转换为符合项目规范的 UI 代码，精确处理标记、样式与设计标记整合。

agents-md-generator

为 AI 编码代理生成分层且节省 token 的 AGENTS.md 文件，提供全库上下文与项目特定指南。

tailwind-config

管理 monorepo 中的 Tailwind CSS 配置、自定义设计令牌、主题与设计系统工具。

designer

React 与 Next.js 专家级 UI/UX 设计助手。提供视觉审核、设计系统架构，以及 Tailwind CSS 与 shadcn/ui 的实现指导，助力打造专业级 Web 应用程序。

ui-design-system

专业 UI 设计系统工具包，涵盖设计代币生成、组件架构、响应式设计计算及开发人员交接文档，确保视觉一致性。

elegant-design

使用 React、Next.js 和 shadcn/ui 等现代设计系统，构建专业、易用且具响应式的界面。专注于开发者工具、聊天界面及实时流式组件。

design-review

设计师级别质量保证：自动检测并修复视觉不一致、间距、层级问题与 UI 打磨。通过前后对比截图进行迭代验证。

core-components

核心组件库与设计系统模式，通过设计令牌 (design tokens) 确保 UI 开发的一致性。

color-palette

从单一十六进制颜色代码生成完整且易于访问的色彩系统。包含 11 阶色谱 (50-950)、语义标记、深色模式变体及 Tailwind v4 CSS 输出。

figma

利用 Figma MCP 服务器获取设计数据、提取资源，并将 Figma 节点转换为符合设计系统规范的 React 与 Tailwind 代码。