// 01 Astryx 是什么
快速结论
Astryx 是 Meta 开源的"Agent 就绪（agent-ready）"设计系统（Design System），基于 React + StyleX 构建，含 150+ 可访问、可主题化组件，支持暗黑模式、生产级模板、CLI 脚手架与 MCP 集成。Meta 内部已用它约八年、支撑超 1.3 万个应用，截至 2026-06 推出开源 beta，代码托管在 GitHub（facebook/astryx）。国内可正常访问 GitHub 与文档。
适合谁优先使用
- 用 React 做前端、想要一套成熟组件库 / 设计系统的团队
- 追求可访问性（a11y）与统一主题的产品与设计团队
- 想让 AI Agent 通过 MCP 自动搭建界面的开发者
- 不愿重复造轮子、要快速交付一致 UI 的独立开发者
核心能力拆解
150+ React 组件
可访问、可主题化，覆盖常见 UI 需求。
StyleX 样式方案
Meta 的原子化 CSS-in-JS，兼顾性能与灵活主题。
暗黑模式 + 自定义主题
开箱支持深浅色与完全自定义主题。
CLI + MCP 集成
命令行脚手架搭项目，MCP 让 AI Agent 可直接调用生成界面。
生产级模板
提供可直接用的模板，"停止重造地基，专注交付想法"。
和同类工具怎么选
| 需求 | 优先考虑 | 判断标准 |
|---|---|---|
| React 生产级设计系统 | Astryx / MUI / Ant Design | 组件成熟度与生态 |
| 让 Agent 自动搭界面 | Astryx | 内置 MCP 集成 |
| 非 React 项目 | 其它框架组件库 | Astryx 绑定 React + StyleX |
国内平替：React 组件库可用 Ant Design；但"Meta 出品 + StyleX + MCP Agent 就绪"是 Astryx 差异点。
限制与避坑
- beta 阶段（2026-06 开源），API 可能变动。
- 绑定 React + StyleX 技术栈，非 React 项目不适用。
- "设计系统"偏工程组件库，非零基础可视化设计工具。
NavXD 使用建议
用 React 且想要一套"大厂验证过、可访问、还能让 AI 通过 MCP 直接搭界面"的设计系统，Astryx 值得一试；已稳定使用 Ant Design / MUI 的团队则不必急着迁移。
// 02 核心 功能
- 核心定位Meta 开源的"Agent 就绪"设计系统，React+StyleX，150+ 可访问组件，内置 MCP 集成。
- 分类索引当前归档在 AI 设计，方便和同频工具横向比较。
- 能力标签关联标签包括 开源、MCP、React、Meta、设计系统、StyleX。
- 使用入口已记录可访问入口，可通过本页主按钮跳转。
// 03 使用 场景
- 快速判断是否适合当前任务结合 AI 设计 定位和 开源、MCP、React 标签，先判断它是否匹配你的工作流。
- 横向比较同类工具从相同分类和标签继续探索替代工具，减少只看单个产品带来的选择偏差。
- 沉淀工具选型资料把官网入口、平台、版本和 NavXD 标签合并成一页，适合做选型记录或团队分享。
// 04 常见 问题
Astryx 是什么？
Meta 开源的"Agent 就绪"设计系统，React+StyleX，150+ 可访问组件，内置 MCP 集成。
Astryx 适合哪些场景？
可优先参考它所属的 AI 设计 分类，以及 开源、MCP、React、Meta、设计系统 等标签。
Astryx 是否提供可用入口？
本页已记录官网或下载入口，可通过顶部主按钮访问。
Astryx 支持哪些平台？
当前记录为网页工具，通常可通过浏览器访问。
