What is Astryx?

Astryx is Meta’s open-source design system built on React and StyleX. It includes accessible components, brand-level themes, templates, dark mode, and CLI/MCP docs. The system is designed to adapt to your workflow rather than forcing you to adapt to it, offering customization paths for both human developers and AI agents.

Who it's for

• Design engineers — who want a production-ready component library with built-in accessibility and theming.
• Product teams — that need a consistent, brandable UI system that ships fast without sacrificing quality.
• AI tooling builders — who want agent-ready documentation and CLI/MCP support for scaffolding and generating themes.

Key features

Over 160 accessible components

Astryx ships with a large library of React components that are accessible by default. Each component includes built-in spacing, dark mode support, and flexible styling through StyleX, so you can focus on building rather than reinventing UI patterns.

Brand-level theming

The system comes with fully customizable themes that you can adapt to your brand without starting from scratch. Themes are designed to be swapped, extended, or overridden, giving you a consistent visual language across your entire product.

CLI and MCP support for AI agents

Astryx is built for the modern development workflow. You can scaffold projects, browse templates, generate themes, and access agent-ready documentation directly from the command line or through MCP (Model Context Protocol). This makes it easy to integrate with AI coding assistants.

Dark mode out of the box

Every component and theme in Astryx supports dark mode natively. There’s no extra configuration or third-party dependency needed — just toggle the theme and the entire system adapts.