Meta 把养了八年的内部设计系统搬出公司,1.3 万个应用在用的组件库开放下载

Meta 把养了八年的内部设计系统搬出公司,1.3 万个应用在用的组件库开放下载

1小时前
duguying
2 阅读
来源:GitHub

驱动 13,000 多个应用的公司内部设计系统 Astryx 整体开源:150+ 无障碍组件、无样式锁定,人和 AI 助手用同一套工具构建界面。

相关标签

#GitHub#Trending#Meta#设计系统#前端

Meta 做了一个相当大方(也相当少见)的决定:把公司内部用了八年、驱动 13,000 多个应用的设计系统 Astryx 整体开源。目前项目处于 Beta 阶段,MIT 许可,npm 包 @astryxdesign/core 已经可以安装。

不是又一个组件库,而是 Meta 的”内部标准答案”

Astryx 在 Meta 内部长了八年,是该体系内使用量最大、体量最大的设计系统——这意味着它不是某个团队的开源副业,而是支撑全公司产品的核心基础设施。开源版一口气带来 150+ 无障碍组件、品牌级主题、暗色模式、可直接上线的模板和一个 CLI。

技术上它构建于 React 19+ 和 StyleX 之上,但对使用者的姿态刻意放低:导入预构建的 CSS、使用带类型的 React 组件即可,不需要构建插件,不需要引入新的样式库。

四个值得留意的差异化设计

  • 开放内部。组件可以在任意层级组合,不会被封闭的顶层 API 锁死;需要更深定制时,swizzle 能把组件的完整源码 eject 到你的项目里归你所有。
  • 无样式锁定。Astryx 内部用 StyleX 写样式,但这对消费者不可见——你可以用 Tailwind、CSS modules 或普通 CSS 通过 className 覆盖,项目里已有什么就用什么。
  • 定制不必包装。一个主题就是一组 CSS 自定义属性覆盖,设计师不用 fork、不用包装组件源码,就能把 Astryx 改成自家品牌的模样。
  • 为人和 Agent 同时设计。API、文档和 CLI 三者协同设计,让人和 AI 助手从同一份参考、以同样的方式构建界面。

最后一正是当下最有时代感的一条:CLI 支持全局安装(npm i -g @astryxdesign/cli),装一次,机器上的每个编码 agent 都”懂 Astryx”,项目内则运行项目自己的版本。

迭代节奏:一天一个版本

开源后节奏相当凶猛:11 月 6 日到 7 日连发 v0.7.9、0.7.10、0.7.11 三个版本,细节抠到触屏下 Popover 从触发器里”生长”出来的动画时长、DropdownMenuSubMenu 的悬浮延迟、Timestamp 的 IANA 时区渲染。11 月 8 日主分支上还有 CLI 实验性搜索索引导出等新提交。

文档、Storybook 和在线 Sandbox 都已上线(astryx.atmeta.com),前端和设计工程团队可以直接上手体验这套”从 Meta 内部走出来”的组件体系。

仓库地址:https://github.com/meta/astryx

返回列表

更多资讯

想看更多优质内容?

浏览所有资讯