Skip to content
Lenso UI

Agent Skills

让 AI 助手能够使用 HeroUI v3 组件来构建 UI

HeroUI Skills 为你的 AI 助手提供关于 HeroUI v3 组件、模式与最佳实践的全面知识。

HeroUI v3 MCP 服务器

安装

curl -fsSL https://heroui.com/install | bash -s heroui-react

或者使用 skills 包：

npx skills add heroui-inc/heroui

支持 Claude Code、Cursor、OpenCode 等。

安装范围

默认情况下，安装脚本会把 skill 安装到用户主目录，因此在所有项目中都可用。如果只想安装到当前项目，请在项目根目录下运行安装脚本并加上 HEROUI_SKILL_SCOPE=project —— 当只有部分项目使用 HeroUI 时，这样可以避免让 skill 出现在每个项目的 agent 上下文中。

curl -fsSL https://heroui.com/install | HEROUI_SKILL_SCOPE=project bash -s heroui-react

每个被检测到的工具都会使用它自己读取的项目目录：Claude Code 使用 .claude/skills/，Cursor 使用 .cursor/skills/，OpenCode 使用 .opencode/skills/，Codex 和 Antigravity 使用 .agents/skills/。

使用方法

Skills 会被你的 AI 助手 自动发现，你也可以通过 /heroui-react 命令直接调用。

只需让你的 AI 助手：

  • 使用 HeroUI v3 构建组件
  • 使用 HeroUI 组件创建页面
  • 自定义主题和样式
  • 查阅组件文档

对于更复杂的使用场景，请使用 MCP 服务器，它提供对组件文档与源代码的实时访问。

包含的内容

  • HeroUI v3 安装指南
  • 所有 HeroUI v3 组件，包含 props、示例与使用模式
  • 主题与样式指南
  • 设计原则与组合模式

结构

skills/heroui-react/├── SKILL.md              # Main skill documentation├── LICENSE.txt           # Apache License 2.0└── scripts/              # Utility scripts    ├── list_components.mjs    ├── get_component_docs.mjs    ├── get_source.mjs    ├── get_styles.mjs    ├── get_theme.mjs    └── get_docs.mjs

相关文档