HeroUI下载aiapp下载安装

HeroUI是什么？

HeroUI（原NextUI）是一个基于TailwindCSS的美观、快速且现代的ReactUI库，支持主题定制、明暗模式自动切换，基于ReactAria实现高可访问性，提供类型安全的开发体验和多包结构，含210+预制组件的Pro版本，并且兼容Next.js新目录结构。

HeroUI主要特点

基于TailwindCSS：使用TailwindCSS作为样式引擎，无运行时样式，不会在你的包中产生不必要的类。

自动暗黑模式识别：能够自动识别HTML主题属性的变化，从而自动切换主题。

完全类型化：提供完全类型化的API，最小化学习曲线，帮助开发者快速上手。

组件解耦：组件分为多个包，可只安装所需的组件。

遵循WAI-ARIA指南：组件遵循WAI-ARIA指南，提供键盘支持和合理的焦点管理。

预建模板丰富：提供超过210+个漂亮的响应式组件。

HeroUI核心功能

主题系统

提供TailwindCSS插件，支持修改默认主题的语义标记（如颜色、背景）或创建全新主题，示例代码展示了不同主题的主色配置（如primary:"#0072f5"）。

支持自动明暗模式切换，检测HTML的dark属性自动切换主题，只需在根标签添加属性即可启用默认深色主题。

性能

基于TailwindCSS，无运行时样式，打包时剔除未使用类，保证轻量快速。

全类型化API（TypeScript支持），降低学习曲线，支持ReactServerComponents（组件含"useclient"指令，可直接在RSC中使用）。

多包结构设计，允许开发者按需安装组件，减少冗余依赖。

可访问性（Accessibility）

基于ReactAria构建，遵循WAI-ARIA标准，内置键盘导航、焦点管理、屏幕阅读器支持等功能，焦点环仅在键盘或屏幕阅读器导航时显示。

组件定制能力

基于TailwindVariants，支持通过插槽定制组件样式，避免类冲突。示例代码展示了自定义按钮的样式配置（如悬停动画、阴影效果）。

组件支持**polymorphicasprop**，可覆盖组件标签（如将按钮渲染为链接）。

HeroUI常见问题

HeroUI如何定制主题？

答：

HeroUI的可访问性体现在哪些方面？

答：

HeroUIPro版本提供哪些核心资源？

答：