Meta Unveils Astryx — A React Design System with AI Agent and MCP Support

Meta has released Astryx — an open-source React design system that was designed from the outset for collaborative work between engineers and AI agents via a unified API.

What is Astryx?

Astryx is built on StyleX — a static CSS styling library that Meta has been developing for several years. StyleX compiles styles into atomic CSS at build time, eliminating unnecessary runtime dependencies and making components predictable. The system is based on a cascade of CSS variables for theming.

Colors, spacing, border radii, and typography are defined via design tokens, which can be overridden at any level of the component tree. This approach is familiar to developers who have worked with Tailwind or Radix Themes, but Astryx adds a layer of machine readability on top. The project evolved internally at Meta for eight years, gradually transforming from an internal tool into a public product.

It is now in Beta and available under an MIT license — with no restrictions on commercial use.

CLI and MCP

Server as Key Components The main thing that distinguishes Astryx from other design systems is its built-in CLI and MCP server. Most UI libraries are delivered as an npm package with documentation: a developer reads the README, selects a component, and writes code. Astryx breaks this order.

The CLI allows interaction with the system from the terminal: installing components, updating tokens, generating code snippets. The MCP server (Model Context Protocol) opens the same capabilities for AI agents — Claude, GPT, or any other tool supporting the protocol gains access to the system's API and documentation in a machine-readable format. The key consequence: the engineer and the agent work with the same commands, receive identical components, and adhere to unified design guidelines.

There is no separate “agent mode” — one system, understandable to both.

• CLI: install components, generate code, update themes directly from the terminal
• MCP server: machine-readable access to API and documentation for AI agents
• CSS variables: agent changes theme just like a designer — via tokens
• Unified API: a single entry point for humans and agents
• MIT license: no restrictions, can be used in commercial products ## Why is this happening now? The Model Context Protocol has grown in recent months from an experimental Anthropic standard into a de-facto protocol for connecting AI agents to external tools. GitHub Copilot, Cursor, Claude Code, and dozens of other tools already support MCP. Most existing products receive MCP integration on top of an existing architecture — as a plugin added retroactively. Meta took a different path: in Astryx, MCP is built-in from the start, alongside the CLI and StyleX. This makes the integration cleaner and more predictable for agents, who dislike workarounds. For teams already using AI code generation, this means the ability to delegate to an agent not just writing lines of code, but also selecting components, configuring themes, and checking guideline compliance — all within a single tool.

What does this mean?

Astryx is a signal about the direction in which design systems are moving. The next generation of UI libraries will be designed with the expectation that their primary reader will be an agent, not just a developer. Meta, with eight years of internal practice and its own AI infrastructure, has taken this step first. *Meta is recognized as an extremist organization and banned in the Russian Federation.