你上次讓 agent 寫一個頁面，它一次就寫對了嗎？Meta 剛把一個設計系統開源出來，名字叫 Astryx，它在 Meta 內部用了八年，支撐着 13,000 多個應用。它真正特別的地方不是組件多，而是人和 agent 用同一套東西寫界面。
這個項目在 GitHub 上叫 meta/astryx，MIT 授權，基於 React 19 和 StyleX。它帶着 150 多個無障礙組件、7 套現成主題、深色模式和一個 CLI。11 月 9 日的 GitHub Trending 日榜上，它排在總榜第二，當天多了 3,324 顆星，總數到了 18,670 顆。
它的設計方式是把 API、文檔和 CLI 放在一起設計，照着同一份約定來。人和 AI 助手寫界面的時候，走的是同一條路，查的也是同一份參考。它的原則裏寫了一句話：每一次讓 Astryx 對 AI 更友好的改動，也讓它對人更友好了。
約定是這套系統的底子。每個組件都照同一套命名、屬性和組合規則來，而且每一個都有完整的文檔。人和 agent 學會幾個之後，對沒用過的組件也能預判它會怎麼表現。
拿 Button 舉例，它的 props 定義就寫在源文件裏。每個字段旁邊都配着註釋，把每個字段的含義寫明瞭，有的還標了默認取值。
export interface ButtonProps extends BaseProps<HTMLButtonElement> {
/** Ref forwarded to the root element */
ref?: React.Ref<HTMLButtonElement>;
/** HTML button type attribute. @default 'button' */
type?: 'button' | 'submit' | 'reset';
/** HTML name attribute for form submission. */
name?: string;
/** HTML value attribute for form submission. */
value?: string | number | ReadonlyArray<string>;
/** Associates the button with a form element by ID. */
form?: string;
/**
* Accessible label for the button (required for accessibility).
* Rendered as visible text by default. When `isIconOnly` is true,
* used as aria-label instead.
*/
label: string;
/**
* The visual style variant of the button.
* @default 'secondary'
*/
variant?: ButtonVariant;
/**
* The size of the button.
* @default 'md'
*/
size?: ButtonSize;（astryx 倉庫 packages/core/src/Button/Button.tsx，ButtonProps 定義節選）
組件也不鎖死：組成它的零件都是直接對外開放的。想改得深一點的話，你就可以用 swizzle 命令把一個組件的完整源碼彈出來，再放到你自己的項目裏自己持有。主題就是一組 CSS 自定義屬性的覆寫，所以設計師不用 fork、不用再包一層，就能給整套界面換一套配色和樣式。
UI 組件庫的下一場競爭，不在誰的組件更好看。agent 已經在替人寫界面了，所以一個庫能不能被 agent 一次寫對，比它自帶多少組件更要緊。往這個方向看，評一個組件庫的新標準正在成形：約定寫得夠不夠清楚、文檔夠不夠讓 agent 照着做、CLI 能不能讓 agent 直接調用。
Astryx 現在還是 Beta 版，所以它的 API 以後可能會變。我的建議是，拿一個真的頁面讓 agent 照着 Astryx 寫一遍，再看 agent 改幾次能寫對，這比讀文檔更能驗出這個庫是不是真爲 agent 準備的。如果你的項目現在就要一個長期穩定的版本，那就再等它穩定下來。
以後你挑組件庫，第一個問題可能不再是這個庫好不好看，而是 agent 照着它寫一頁，能不能一次寫對。你上次讓 agent 寫界面，它改了幾次才寫對？如果這篇對你有用，請訂閱或收藏這個博客。我會繼續分享 AI、安全和開源方面自己動手查過、用過的東西。等下一個被 agent 拿來寫界面的庫出現，我再寫一篇，看 agent 用它寫得對不對。
來源：Meta Astryx 倉庫 https://github.com/meta/astryx