Meta open-sources Astryx, a React design system built for AI agents and MCP

Meta has released Astryx, an open-source React design system that was designed from the start for engineers and AI agents to work together through a single API.

What Astryx is

Astryx is built on top of StyleX, a static CSS styling library that Meta has developed over several years. StyleX compiles styles at build time into atomic CSS, which removes unnecessary runtime dependencies and makes components more predictable.

The system is based on a cascade of CSS variables for theming. Colors, spacing, corner radii and typography are defined through design tokens that can be overridden at any level of the component tree. Developers who have worked with Tailwind or Radix Themes will find the approach familiar, but Astryx adds a machine-readability layer on top.

The project spent eight years evolving inside Meta, gradually turning from an internal tool into a public product. It is now in Beta and available under the MIT license, with no restrictions on commercial use.

CLI and MCP server as key components

What sets Astryx apart from other design systems is its built-in CLI and MCP server. Most UI libraries ship as an npm package with documentation: the developer reads the README, picks a component and writes code. Astryx breaks with that order.

The CLI lets you work with the system from the terminal: install components, update tokens and generate code scaffolds. The MCP server (Model Context Protocol) opens the same capabilities to AI agents: Claude, GPT or any other tool that supports the protocol gets machine-readable access to the system's API and documentation.

The key consequence: an engineer and an agent use the same commands, get the same components and follow the same design guidelines. There is no separate "agent" mode, just one system that both can understand.

• CLI: install components, generate code and update themes straight from the terminal
• MCP server: machine-readable access to the API and documentation for AI agents
• CSS variables: an agent changes the theme the same way a designer does, through tokens
• Single API: one entry point for both human and agent
• MIT license: no restrictions, can be used in commercial products

Why now

Over the past few months, Model Context Protocol has grown from an experimental Anthropic standard into the 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 get MCP integration on top of a finished architecture, as a plugin bolted on after the fact. Meta took a different route: in Astryx, MCP is built in from the start, on a par with the CLI and StyleX. That makes the integration cleaner and more predictable for agents, which don't like workarounds.

For teams already using AI code generation, this means they can delegate more than writing lines of code to an agent: it can also pick components, configure the theme and check compliance with guidelines, all within a single tool.

What this means

Astryx signals the direction design systems are heading. The next generation of UI libraries will be designed on the assumption that their main reader is an agent, not just a developer. With eight years of internal practice and its own AI infrastructure, Meta is the first to take this step.

*Meta is designated an extremist organization and banned in Russia.