项目概述

Astryx 是由 Meta（Facebook）开源的企业级全栈设计系统与 React 组件库。在过去 8 年间，Astryx 在 Meta 内部深度演进与反复打磨，作为核心基建支撑了公司内部超过 13,000 个生产级 Web 应用。Astryx 专为大规模工程化、极速构建与下一代 AI 编程智能体（Agent-Ready）而设计，内置了 170+ 个开箱即用的高无障碍组件、深度集成 StyleX 原子 CSS 引擎，并原生适配 React 19+。

核心特性

🏢 Meta 工业级基建积淀：经过 13,000+ 款大型商业应用与海量工程团队检验，涵盖布局、导航、表单、复杂数据选择器到多模态聊天界面（Chat Composer / Tool Calls）的全生命周期组件。
🤖 AI 编程智能体原生支持 (Agent-Ready)：配备专用 CLI 与 MCP（Model Context Protocol）协议，并自动化生成 AGENTS.md / CLAUDE.md 规范契约，让 AI 能够精准无歧义地调用、排版和定制组件。
🎨 多品牌主题引擎与设计 Token：提供 Neutral、Butter、Chocolate、Matcha、Gothic、Y2K 等多套可自由扩展的工业级主题包，通过 CSS Custom Properties 与 Cascade Layers 统一设计变量。
⚡️ React 19 & StyleX 深度集成：底层依托 StyleX 实现无死角原子化样式编译与跨层级样式覆盖（xstyle），同时完全兼容 Tailwind CSS 与原生 classNames。

快速上手与示例代码

# 安装 Astryx 核心库、StyleX 引擎、预设主题及 CLI 工具（需 React 19+）
npm install @astryxdesign/core @stylexjs/stylex @astryxdesign/theme-neutral @astryxdesign/cli

# 初始化生成 AI 智能体规范指南
npx astryx init

import React from 'react';
import { Button } from '@astryxdesign/core/Button';
import { VStack, Card } from '@astryxdesign/core/Layout';
import { Heading, Text } from '@astryxdesign/core/Typography';
import { Badge } from '@astryxdesign/core/Badge';

export function DashboardOverview() {
  return (
    <Card elevation="low" padding={6}>
      <VStack gap={4}>
        <div className="flex items-center justify-between">
          <Heading level={3}>企业级研发看板</Heading>
          <Badge tone="success" label="Meta 13,000+ Apps" />
        </div>
        <Text tone="subtle">
          基于 Astryx 现代化企业级设计系统构建，无缝适配 React 19 并拥抱 AI 协同开发。
        </Text>
        <Button
          variant="primary"
          label="立即部署应用"
          onClick={() => console.log('Deploy with Astryx')}
        />
      </VStack>
    </Card>
  );
}

技术选型建议与适用场景

非常适合：大型企业级后台管理系统、多团队协作的复杂业务平台、对无障碍（Accessibility）和设计一致性有严苛要求的团队，以及正全面转向 AI 协同编程的高效工程组织。
与同类方案对比：相比于 Ant Design 或 Material UI，Astryx 具备更前沿的 React 19 / StyleX 底层架构和原生 Agent MCP 协议集成；相比于轻量级无头组件，它提供了更健全开箱即用的 170+ 全场景组件。

Astryx (Meta)

项目概述

核心特性

快速上手与示例代码

技术选型建议与适用场景

讨论与评价

相关组件推荐

Duolingo UI (ShadLingo)

8bitcn/ui

23rd