暗黑模式
HeroUI 同时支持 light 和 dark 主题。要启用暗黑模式，只需将 dark 类添加到你的根元素（html、body 或 main）即可。
这将全局启用暗黑模式。 对于主题切换功能，你可以使用主题库或创建自定义实现。
使用 next-themes
对于 Next.js 应用程序，next-themes 提供了无缝的主题切换功能。
更多信息，请参考 next-themes 文档。
Next.js App 目录设置
安装 next-themes
在你的项目中安装 next-themes。
添加 next-themes provider
使用 next-themes 的 ThemeProvider 组件包裹你的应用。
前往你的 app/providers.tsx 或 app/providers.jsx 文件（如果不存在则创建），并使用 HeroUIProvider 和 next-themes provider 组件包裹 Component。
注意：我们使用
class属性来切换主题，这是因为 HeroUI 使用className属性。
添加主题切换器
将主题切换器添加到你的应用中。
注意：你可以使用任何你想要的主题名称，但请确保它存在于你的
tailwind.config.js文件中。查看创建主题了解更多详情。
Next.js Pages 目录设置
安装 next-themes
在你的项目中安装 next-themes。
添加 next-themes provider
前往你的 pages 目录下的 _app.js 或 _app.tsx 文件（如果不存在则创建），并使用 HeroUIProvider 和 next-themes provider 组件包裹 Component。
注意：我们使用
class属性来切换主题，这是因为 HeroUI 使用className属性。
添加主题切换器
将主题切换器添加到你的应用中。
注意：你可以使用任何你想要的主题名称，但请确保它存在于你的
tailwind.config.js文件中。查看创建主题了解更多详情。
使用 use-theme hook
如果你正在使用原生 React 与 Vite 或 Create React App，你可以使用 @heroui/use-theme hook 来切换主题。
安装 @heroui/use-theme
在你的项目中安装 @heroui/use-theme。
添加主题切换器
将主题切换器添加到你的应用中。
注意：你可以使用任何你想要的主题名称，但请确保它存在于你的
tailwind.config.js文件中。查看创建主题了解更多详情。
