Arco Design
字节跳动出品的企业级设计系统，兼顾效率和年轻化视觉的平衡方案
简介
Arco Design 是字节跳动推出的一套偏企业级的设计系统和组件库，既有 React 版本，也有 Vue 版本。它的整体风格比传统企业后台更年轻，适合需要兼顾效率和视觉感的产品。
如果说 Ant Design 更像成熟稳重的企业后台，那么 Arco Design 相对更轻、更活泼一些。它适合做企业协同产品、效率工具、数据平台、SaaS 后台、运营系统等。产品经理可以把 Arco Design 理解为：在企业级能力和年轻化视觉之间做平衡的一套方案。
关键信息
- 类型：工具（前端 UI 组件库 + 设计系统）
- 领域：前端开发 / 产品设计 / 企业软件
- 技术栈：React / Vue（双版本）
- 官方网站：https://arco.design
- 开源状态：MIT 协议开源
- 相关概念：Ant Design、Element Plus、Mantine
核心特性
双技术栈支持
Arco Design 同时提供 React 和 Vue 版本，这在主流 UI 框架中并不常见。这意味着无论团队使用哪种前端技术栈，都可以选择 Arco Design 保持统一的设计语言。
企业级 + 年轻化
在企业级组件完整度和视觉年轻化之间找到了平衡点。既有表格、表单、弹窗等企业级组件，又在设计语言上比 Ant Design 更轻、更活泼。
设计系统配套
提供了完整的设计资源（Figma 组件库、图标库、设计规范），设计师和前端可以基于同一套设计系统协作。Arco Design 的设计规范涵盖了色彩、排版、间距、阴影、动效等所有设计基础元素，确保产品视觉一致性。
物料生态
Arco Design 提供了丰富的物料市场，包括业务组件、页面模板和图标库。团队可以直接复用这些物料加速开发，也可以将自研组件发布到物料市场供其他团队使用。
主题配置平台
提供了可视化的主题配置平台，设计师可以通过图形界面调整设计参数并实时预览效果，生成的配置可以直接导入项目使用。
不同素材中的观点
- 2026-06-12-woshipm-9-ui-frameworks-for-pm：老曹将 Arco Design 定位为”在企业级能力和年轻化视觉之间做平衡的一套方案”，适合做企业协同产品、效率工具、数据平台、SaaS 后台、运营系统。与 Ant Design 的区别在于”更轻、更活泼”。
实用信息
适用场景
- 企业协同产品、效率工具
- 数据平台、SaaS 后台、运营系统
- 需要兼顾企业级能力和视觉年轻化的产品
- 团队同时有 React 和 Vue 项目需要统一设计语言
不太适合的场景
- 面向 C 端用户的轻量产品
- 对品牌差异化有极高要求的产品（仍需二次设计）
注意事项
- Arco Design 的社区规模相比 Ant Design 较小，遇到问题时可能需要更多自行排查
- React 版本的成熟度高于 Vue 版本，选择时需注意
- 如果团队已经在使用 Ant Design 且运行良好，迁移到 Arco Design 的收益需要评估
- Arco Design Pro 提供了完整的中后台模板，可加速项目启动