Meta把内部设计系统开源了，支撑内部13000+应用，专为Agent调优

用AI写前端其实不缺组件库。
开发者想快速搭一个页面，选择已经很多了。
现在大家基本都在用AI，但AI写出的页面问题也很明显，能帮你把按钮、表单、弹窗做出来，却不一定能帮你把一个真实产品做得统一、稳定、可维护，不像是一个很专业的产品，经不起推敲。
其实就是设计上没有一套规范。
Meta开源的Astryx最近大更新，改造成了Agent适配的设计系统。
Astryx已经在Meta内部演进8年，是Meta内部使用规模最大的设计系统之一，支撑了13000+个应用。

项目简介

Astryx是Meta开源的React设计系统，提供150+可访问、可主题化的UI组件，并配套主题、模板、CLI和AI Agent友好的开发工具。
Astryx想解决更完整的产品工程问题，怎么让设计规范、组件实现、主题系统、模板和 AI 编程工具使用同一套语言。
Meta明确把AI Agent当成设计系统的一等用户。

Astryx让人和AI使用同一套组件、同一套文档、同一套CLI工具。
AI写前端代码，不只是生成HTML和CSS，更要理解产品界面该怎么组织、控件该怎么组合、主题该怎么继承、交互状态该怎么处理。
设计系统会成为AI生成高质量前端的基础设施。
DEMO

我仔细看了组件库，里面的这些组件都是现在大家做软件比较常用的，而且是非常常用的。

有这样的一套设计标准其实是非常爽的，一般的小公司其实都没有太完善的设计标准，做出来的产品就会很不自然。

再来看看我随便测试了下，让AI用这个设计系统做了个前端页面。
这看起来就很标准了。

功能特点

组件足够完整
Astryx提供150+UI组件，覆盖按钮、表单、菜单、导航、布局、数据展示等常见场景。
这类设计系统的价值在于团队能不能用同一套组件持续构建大量页面。
产品级方案

Astryx提供多套官方主题，比如neutral、butter、chocolate、matcha、stone、gothic、y2k。
它的主题不是简单换颜色，而是通过CSS custom properties进行系统化覆盖，这样开发者可以快速获得一套完整视觉风格，也可以根据品牌继续定制。
技术栈
Astryx内部使用StyleX，但你不需要强制接入 StyleX。
你可以继续用Tailwind、CSS Modules或普通CSS，通过className去覆盖样式。这对已有项目很重要，因为很少有人愿意为了一个组件库推翻现有工程体系。
它有CLI，不只是组件
Astryx 提供CLI，可以用来查询组件、搜索模板、查看 tokens、初始化项目、构建主题、运行codemod。
对AI来说，CLI很关键，因为AI可以通过结构化命令读取组件信息、查找模板和生成代码，减少胡写API的概率。
项目链接

https://github.com/facebook/astryx