React 组件库
提供 100 多个采用语义化样式的开源 React 组件，支持全面自定义和 Recharts 数据可视化。
面向 React 和 Figma 的开源设计系统
Once UI 是面向 React 和 Figma 的开源设计系统，为构建网站和产品界面的创作者而开发。Once UI Core 为 React 打包了 100 多个组件，提供语义化样式、自定义能力和 Recharts 数据可视化；它通过 npm 以 @once-ui-system/core 的形式发布，并针对 Next.js 进行了优化。
更广泛的 Once UI 产品系列在核心库基础上扩展了可复制粘贴的区块、模板、配套 Figma 库，以及 Stack——一个用于从可选界面组合单个应用的付费搭建层。Stack 可包含 landing、dashboard、docs、store、agency、journal 或 spotlight 界面；Supabase 身份验证和 Stripe 计费是可选附加项。Core 和区块采用 MIT 许可且免费；定价页面将 Stack 以及模板的商业使用列为 Pro 功能。
核心能力
主题与令牌系统
采用包含语义化令牌和主题控制的样式系统，无需重写页面结构即可更改视觉系统。
可复用区块与模板
包含可复制粘贴的区块、布局、页面和免费模板，可将其调整为可用的产品界面。
Figma 设计库
Figma 库采用与 React 系统相同的组件和令牌概念，用于品牌设计与原型制作，并支持嵌套组件、响应式断点变量以及浅色/深色模式。
组合式应用搭建
Stack 根据选定的界面搭建一个代码仓库，在共享外壳中包含路由、主题、SEO 和设计配置。
可选后端功能切片
只有在需要时，Stack 才会添加 Supabase 账户能力和 Stripe 结账或订阅功能；对于不需要这些功能的项目，可避免引入相应依赖和环境变量。
使用场景
发布创作者或产品网站
使用 Once UI Core 和区块组建品牌营销网站、定价页面、博客或法律页面，无需从头设计每个界面元素。
开发前制作原型
使用 Figma 库制作响应式产品流程原型，建立令牌和品牌方向，并使设计概念与 React 实现保持一致。
构建需要身份验证的产品界面
构建包含分析视图、用户管理或设置的产品外壳时，可在 Stack 中选择 dashboard 和账户相关能力；需要账户时可添加 Supabase 身份验证。
创建多界面应用
在一个 Stack 代码仓库中组合 docs、store、agency、journal 或 spotlight 界面，用于内容、电商、工作室、出版或新闻通讯类产品。
逐步开发并扩展项目
个人项目可以从免费的 Core、区块或模板开始；当项目成为付费产品或客户交付物时，再评估 Stack 以及 Pro 的商业使用条款。
Pros and Cons
Pros
- 采用 MIT 许可的开源 Core，包含 100 多个 React 组件。
- 适用于多种 React 配置，包括 Next.js、Vite、React Router 和自定义 React 应用。
- React 系统与 Figma 库共享设计概念，包括语义化令牌、响应式变量以及浅色/深色模式支持。
- 可复制粘贴的区块和可组合的 Stack 界面，为独立界面和更广泛的产品外壳都提供了起点。
Cons
- 该系统拥有自己的语法，习惯使用 Tailwind 或其他组合式组件库的开发者可能需要进行适应。
- 免费模板规定仅限个人使用；定价页面说明，Stack 和模板的商业使用包含在 Pro 中。
- 详细的 Stack 搭建能力和产品系列中的若干功能独立于免费的 Core 软件包，因此用户评估该产品时应区分 Core、区块、模板和 Stack。
FAQ
什么是 Once UI？
Once UI 是面向 React 和 Figma 的开源设计系统。其 React 软件包可通过 npm 以 @once-ui-system/core 的形式获取；该系统针对 Next.js 进行了优化，同时也支持其他 React 应用配置。
Once UI 可以免费使用吗？
Once UI Core 采用 MIT 许可证。定价页面说明，Core 和 100 多个区块继续免费提供，而付费 Pro 计划增加了 Stack，以及 Stack 和模板的商业使用权。
Once UI 只能与 Next.js 搭配使用吗？
不是。Once UI 可运行于使用 Next.js、Vite、React Router 或其他 React 配置的应用中。Next.js 通过可选适配器获得一流支持；不使用适配器时，组件会回退到标准 DOM 行为。
如何开始使用 Once UI？
通过 npm 以 @once-ui-system/core 的形式安装 React 组件库。该网站还提供文档、可复制粘贴区块、模板和用于设计工作的 Figma 库。
Once UI Stack 增加了什么？
Once UI Stack 是付费产品层，用于从 landing、dashboard、docs、store、agency、journal 和 spotlight 等界面组合一个代码仓库。Supabase 身份验证和 Stripe 计费是可选的功能切片，并非必需依赖。
Quick Facts
- 类别
- 开发者工具 / 设计系统
- 平台
- React、Figma、Next.js、Vite、React Router
- 软件包
- @once-ui-system/core
- Core 许可证
- MIT
- Core 组件
- 100+；包含 Recharts 数据可视化
- 付费产品层
- Once UI Stack；Pro 还增加模板的商业使用权
Once UI 替代品
ByteAsk
ByteAsk 是面向 C 和 C++ 的终端优先 AI 编码 agent，可直接编辑仓库，并在展示 diff 前用真实编译器、调试器、sanitizers 和测试验证修改。提供免费版与付费方案。
CreateOS Sandbox
CreateOS Sandbox 是基于 Firecracker 微型虚拟机的隔离计算环境，用于运行代码和 agent 工作负载，支持私有网络、SDK、CLI 和 MCP 程序化控制。
GitBot
GitBot 是基于本地浏览器的工作区，可借助 Claude Code、Codex 或 OpenCode 创建可复用的编程机器人，跨仓库文件夹运行代理，并保留持久线程与可配置权限。
hob
hob 是面向编码 agent 的独立工作区，可将 agent 会话、终端、历史记录和后续工作围绕你已在用的工具与提供商有序管理，适合重视本地路由、历史和工作区结构控制的开发者。
Ably Chat
Ably Chat 是用于构建自定义实时聊天应用的 chat API 平台，支持房间消息、输入指示、在线状态、表情回应与消息更新，并提供按使用量计费选项。
Manta AI
Manta AI 是面向团队的自治式网页应用测试工具，可从 URL 自动探索应用、映射行为、捕捉回归，并用自然语言生成测试，无需脚本或维护选择器。