There’s a frustration you know well if you’ve ever let a coding agent loose on a UI: you ask Claude Code or Cursor to “add a settings page using our design system”, and it confidently writes code that references props that don’t exist, imports components that were never published, and invents a variant="secondary" that the library never shipped. The agent isn’t stupid — it’s improvising, because traditional design systems keep their documentation in HTML built for humans and expose nothing a machine can query.
Meta just released their answer to exactly that problem. It’s called Astryx, and the one-liner from the repo says it straight: “An open source design system that’s fully customizable and agent ready.”
What it is, concretely
Astryx isn’t a greenfield project chasing agent hype. It grew inside Meta over eight years, powering more than 13,000 internal apps across Facebook, Instagram, and Threads. What just landed is the public release, with an MIT license — in beta (CLI 0.0.14, so treat it accordingly).
The foundation is React plus StyleX, Meta’s atomic CSS engine that compiles styles to static CSS at build time (the same engine Meta released in 2023). On top of that you’ve got 90+ accessible components, ten themes via a CSS-variables cascade (default, neutral, daily, butter, chocolate, matcha, stone, gothic, brutalist, y2k), and page templates ready to ship.
Note on the count: the repo documentation counts 90+ components; Meta’s own docs site says 150+. Meta acknowledges the difference — some components exist internally but aren’t fully documented publicly yet. We’re going with “90+ documented”.
The part that matters for yoDEV: the manifest
The standout feature isn’t the component count. It’s that the CLI ships an auto-descriptive JSON manifest — think of it like an OpenAPI, but for a frontend design system CLI. A single call returns every command, every argument, every flag (with types, options, and defaults), and the response types each command can emit:
npx astryx manifest --json
That single payload means the agent doesn’t have to scrape --help text and guess. It reads a structured contract. The same CLI a human uses (astryx, or the shorthand xds) is the API the agent uses — there’s no separate “agent mode” that gets out of sync over time.
And on top sits an MCP server, implementing the standard over JSON-RPC 2.0. Through it, any MCP-compatible agent — Claude Code, Cursor, Copilot — can scaffold projects, navigate components, generate or validate themes, and pull agent-ready docs. The agent also gets JSDoc composition hints, so it knows how components are supposed to fit together, not just that they exist.
Setup: plug your agent in
Install core, a theme, and the CLI:
npm install @astryxdesign/core @astryxdesign/theme-neutral
npm install -D @astryxdesign/cli
One useful tip straight from the README: add a script so agents and new devs can invoke the CLI reliably without path errors:
"scripts": {
"xds": "node node_modules/@astryxdesign/cli/bin/astryx.mjs"
}
Then your agent (or you) can explore the whole system from the terminal:
npx astryx search button # search across components, hooks, docs, and templates
npx astryx component Button # full docs for a component
npx astryx template dashboard # emit the full source for a page
npx astryx docs tokens # spacing, color, radius, and typography tokens
npx astryx swizzle Button # eject a component's source for customization
The search command is really handy: it ranks across components, hooks, doc topics, and templates all at once, with fuzzy matching for typos, and tells you the exact command to run for each result.
When it’s worth it
Three clear cases. Internal dashboards — eval views, monitoring, admin panels — spin up fast from the dashboard/table/detail templates. Agent-built UIs — the whole reason this exists: the agent calls the CLI, reads the manifest and docs, then composes real components instead of hallucinating them. And multi-brand products, where a single set of components serves multiple brands and you switch themes through the variables cascade without rewriting components.
The closest familiar comparison is shadcn/ui — both favor composition and CLI scaffolding, and both let you eject and own the source. Astryx stands out with its compile-time StyleX engine and, more importantly, its MCP tooling.
The limits, straight up
It’s beta. CLI 0.0.14 is an early version number and the API can shift. Two repo packages (lab, experimental components, and vega, the charts wrapper) still aren’t published to npm. And the component count difference above is real. Eight years and 13,000 apps of engineering work sit behind it — but the public project is young. For a side project or internal tool, it’s a reasonable trade-off. For something you’re shipping to customers next week, pin your versions and test the upgrade codemods before relying on them.
Bottom line: this is the first time a production-grade design system has handed an agent a machine-readable contract instead of forcing it to guess. If you’re building UIs with Claude Code or Cursor, that’s the difference between an agent that scaffolds screens that work and one that writes plausible-sounding nonsense.