Hay una frustración que conocés bien si alguna vez dejaste que un coding agent metiera mano en una UI: le pedís a Claude Code o Cursor que “agregá una página de settings usando nuestro design system”, y te escribe con total seguridad código que referencia props que no existen, importa componentes que nunca se publicaron, e inventa un variant="secondary" que la librería jamás shippeó. El agente no es tonto — está improvisando, porque los design systems tradicionales guardan su documentación en HTML pensado para humanos y no exponen nada que una máquina pueda consultar.
Meta acaba de liberar su respuesta a exactamente ese problema. Se llama Astryx, y el one-liner del repo lo dice sin vueltas: “An open source design system that’s fully customizable and agent ready.”
Qué es, en concreto
Astryx no es un proyecto greenfield corriendo atrás del hype de los agentes. Creció dentro de Meta durante ocho años, dándole vida a más de 13.000 apps internas en Facebook, Instagram y Threads. Lo que acaba de aterrizar es el release público, con licencia MIT — en beta (CLI 0.0.14, así que tratalo en consecuencia).
La base es React más StyleX, el motor de CSS atómico de Meta que compila los estilos a CSS estático en build time (el mismo motor que Meta liberó en 2023). Encima de eso tenés 90+ componentes accesibles, diez themes vía una cascada de CSS-variables (default, neutral, daily, butter, chocolate, matcha, stone, gothic, brutalist, y2k), y templates de páginas listas para shippear.
Nota sobre el conteo: la documentación del repo cuenta 90+ componentes; el sitio de docs del propio Meta dice 150+. Meta reconoce la diferencia — algunos componentes existen internamente pero todavía no están del todo documentados de forma pública. Nos quedamos con “90+ documentados”.
La parte que importa para yoDEV: el manifest
El feature estrella no es el conteo de componentes. Es que el CLI ships un manifest JSON auto-descriptivo — pensalo como un OpenAPI, pero para el CLI de un design system de frontend. Una sola llamada devuelve cada comando, cada argumento, cada flag (con tipos, opciones y defaults), y los response types que cada comando puede emitir:
npx astryx manifest --json
Ese único payload significa que el agente no tiene que scrapear el texto de --help y adivinar. Lee un contrato estructurado. El mismo CLI que usa un humano (astryx, o el shorthand xds) es la API que usa el agente — no hay un “modo agente” separado que se desincronice con el tiempo.
Y arriba hay un MCP server, implementando el estándar sobre JSON-RPC 2.0. A través de él, cualquier agente compatible con MCP — Claude Code, Cursor, Copilot — puede scaffoldear proyectos, navegar componentes, generar o validar themes, y traer docs agent-ready. El agente además recibe JSDoc composition hints, así sabe cómo se supone que encajan los componentes entre sí, no solo que existen.
Setup: dejá tu agente enchufado
Instalá core, un theme y el CLI:
npm install @astryxdesign/core @astryxdesign/theme-neutral
npm install -D @astryxdesign/cli
Un tip útil directo del README: agregá un script para que los agentes y los devs nuevos invoquen el CLI de forma confiable sin errores de path:
"scripts": {
"xds": "node node_modules/@astryxdesign/cli/bin/astryx.mjs"
}
Después tu agente (o vos) puede explorar todo el sistema desde la terminal:
npx astryx search button # busca entre componentes, hooks, docs y templates
npx astryx component Button # docs completas de un componente
npx astryx template dashboard # emite el source completo de una página
npx astryx docs tokens # tokens de spacing, color, radius, tipografía
npx astryx swizzle Button # eyecta el source de un componente para customizarlo
El comando search es realmente práctico: rankea entre componentes, hooks, docs topics y templates de una sola vez, con fuzzy matching para los typos, y te dice el comando exacto a correr para cada resultado.
Cuándo vale la pena
Tres casos claros. Dashboards internos — vistas de eval, monitoring, paneles de admin — se arman rápido a partir de los templates de dashboard/table/detail. UIs armadas por agentes — la razón misma por la que esto existe: el agente llama al CLI, lee el manifest y las docs, y después compone componentes reales en lugar de alucinarlos. Y productos multi-brand, donde un solo set de componentes sirve a varias marcas y vos cambiás themes a través de la cascada de variables sin reescribir componentes.
La comparación familiar más cercana es shadcn/ui — ambos privilegian la composición y el scaffolding por CLI, y ambos te dejan eyectar y ser dueño del source. Astryx se diferencia en su motor StyleX de compile-time y, más importante, en el tooling de MCP.
Los límites, sin vueltas
Es beta. El CLI 0.0.14 es un número de versión temprano y la API puede moverse. Dos packages del repo (lab, componentes experimentales, y vega, el wrapper de charts) todavía no están publicados en npm. Y la diferencia en el conteo de componentes de arriba es real. La ingeniería de fondo tiene ocho años y 13.000 apps detrás — pero el proyecto público es joven. Para un side project o una herramienta interna, es un trade-off razonable. Para algo que vas a shippear a clientes la semana que viene, fijá tus versiones y probá los upgrade codemods antes de apoyarte en ellos.
El bottom line: es la primera vez que un design system production-grade le entrega a un agente un contrato machine-readable en vez de obligarlo a adivinar. Si estás armando UIs con Claude Code o Cursor, esa es la diferencia entre un agente que scaffoldea pantallas que funcionan y uno que escribe pavadas que parecen plausibles.
