facebook/astryx

项目概览

该项目的 API、文档和 CLI 在设计上让人和 AI 助手使用相同的工具和参考约定；组件支持导出源码，且允许通过 className 使用 Tailwind、CSS modules 或普通 CSS 覆盖样式，不强制使用者采用指定的样式库。

项目类型

AI 编程

应用场景

编程开发

部署方式

查看项目说明

License

MIT

适合谁

• 希望对组件源码有完全控制权并使用自身样式方案（如 Tailwind 或 CSS modules）的开发者。
• 希望复用已文档化的常见界面交互与工作流模式（如表单、导航）的界面构建团队。

核心能力

• 提供 150 余个可复用且可访问的 UI 构建块，并带有完整的 TypeScript 支持，用于构建界面。
• 提供品牌级主题、暗黑模式以及可定制主题，用于将设计系统适配至产品的视觉标识。
• 作为设计系统的一部分，包含可直接交付使用的界面模板。
• 提供用于组件文档、模板、脚手架、主题和 codemods 的命令行工具。
• 允许用户将组件的完整源码导出到自己的项目中，从而由用户拥有并对其进行修改。
• 记录了常见交互和工作流的可复用解决方案，包括表格页面、详情页面布局、表单向导、导航模式和数据录入流程。

限制与风险

• 该项目目前处于 Beta 阶段。
• Vega/Vega-Lite 封装器与图表组件没有稳定版本发布，仅在 canary dist-tag 下发布。

如何开始

• 上手难度较低，无需构建插件、PostCSS 或 Babel 配置。只需使用标准 JavaScript 包管理器安装 @astryxdesign/core 及主题包，然后添加文档记录的 CSS 导入和 Theme Provider 即可完成初步设置。

核验依据

• GitHub 项目简介: An open source design system that's fully customizable and agent ready
• README: **Currently in Beta** · Built on [React](https://react.dev) and [StyleX](https://stylexjs.com)
• README: | [`@astryxdesign/core`](packages/core) | Components, theme system, and utilities | [README](packages/core/README.md) |
• README: It ships 150+ accessible components, brand-level theming, dark mode, ready-to-ship templates, and a CLI as one cohesive system.
• README: Built for people and agents. The API, docs, and CLI are designed together so a person and an AI assistant build the same way, from the same reference.

来源更新时间：2026-08-01T18:17:31Z

打开原始 GitHub 项目