React 19 · Vue 3 · TypeScript · Tailwind CSS v4
UG666 UI
面向业务项目的 UI 组件库，同时提供 React 和 Vue 3 版本。覆盖按钮、表单、反馈、导航、布局等高频场景，配套 Hooks、Composables 与通用工具函数。
24
组件（双版本）
8 + 9
Hooks / Composables
16+
工具函数
100%
暗色模式覆盖
选择你的框架
根据项目技术栈选择对应的组件库文档。
@ug666/react
React 19 · TypeScript
React UI 组件库，基于 CVA 变体系统，提供 24 个组件与 8 个 Hooks。使用 forwardRef、displayName，完全类型安全。
24 组件 8 Hooks CVA 变体
浏览 React 文档
@ug666/vue
Vue 3 · TypeScript
Vue 3 UI 组件库，基于组合式 API，提供 24 个组件与 9 个 Composables。使用 script setup、defineModel、双向绑定。
24 组件 9 Composables script setup
浏览 Vue 文档
① 安装
@ug666/utils 会作为依赖自动装入，无需显式指定。
React 项目
bun add @ug666/reactVue 项目
bun add @ug666/vue② 引入主题样式（必须）
在项目入口（如 main.ts / layout.tsx）引入一次；未引入时组件颜色不会生效。切换暗色模式给 <html> 加 class="dark" 即可。
React 项目
import '@ug666/react/tokens.css'Vue 项目
import '@ug666/vue/tokens.css'核心特性
围绕真实业务场景设计的组件库与文档体验。
双框架支持
React 和 Vue 共享同一套设计语言，API 命名与交互行为保持一致。
统一设计语言
按钮、表单、反馈与布局组件在两个框架间保持一致的视觉风格。
实时组件预览
文档站所有示例使用真实组件渲染，支持暗色模式切换。
Hooks / Composables
防抖、表单、分页、复制、通知等高频能力开箱即用。
通用工具函数
cn、格式化、校验、ID 生成、安全存储、API 客户端等。
暗色模式
所有组件与文档页面均内置暗色主题支持，一键切换。