Meta's Internal Design System Just Went Public, and It's Built for AI Pair Programming

You've probably inherited a design system at some point—the one nobody fully understands, where overriding a button's padding means wrapping it three times and praying. Or maybe you've watched an AI assistant confidently generate component code that doesn't match your actual library. Astryx, Meta's design system, is now open source after eight years of internal use, and it's been rebuilt with both of those problems in mind.

What It Does

Astryx is a design system built on React 19+ and StyleX. It ships 150+ accessible components, brand-level theming, dark mode, ready-to-ship templates, and a CLI as one cohesive package. Inside Meta, it powered 13,000+ apps and grew into the company's largest and most-used design system. Now it's available under the MIT license in beta.

The setup is deliberately simple: you import pre-built CSS and use typed React components. There's no build plugin to configure, no PostCSS or Babel setup, and no styling library you have to adopt. Astryx authors its own styles with StyleX, but that detail stays invisible to you as a consumer—you can override components with className using Tailwind, CSS modules, or plain CSS, whatever your project already has in place.

Why It's Cool

The internals are actually open. Most design systems give you a top-level API and not much else. Astryx exports its building blocks directly, so you can compose components at any level rather than fighting a closed interface. And when you need to go deeper, a "swizzle" command ejects a component's full source into your project—so you own it outright instead of waiting on an upstream fix.

Theming doesn't require forking. A theme in Astryx is just a set of CSS custom property overrides. That means a designer can make the system unmistakably theirs without wrapping components or maintaining a fork. This is a small architectural decision with outsized practical consequences—theming becomes a config problem, not a source-code problem.

It's designed for people and agents together. This is the part that feels genuinely of-the-moment. The API, docs, and CLI were designed as a unit so that a human and an AI assistant work from the same reference. You can install the CLI globally so astryx works in any folder and every coding agent knows about it, while still running your project's own version inside a project. There's even a command (astryx docs global/project-global-or-both) that helps you decide between project install, global install, or both—and the docs recommend both.

No styling lock-in. You're not forced into StyleX just because Astryx uses it internally. If your team already has a styling approach, it keeps working alongside Astryx components.

How to Try It

Astryx requires React 19 or later—react and react-dom are peer dependencies. Install the core package, a theme, StyleX, and the CLI:

# npm
npm install @astryxdesign/core @astryxdesign/theme-neutral @stylexjs/stylex
npm install -D @astryxdesign/cli

# pnpm
pnpm add @astryxdesign/core @astryxdesign/theme-neutral @stylexjs/stylex
pnpm add -D @astryxdesign/cli

# yarn
yarn add @astryxdesign/core @astryxdesign/theme-neutral @stylexjs/stylex
yarn add -D @astryxdesign/cli

Optionally, install the CLI globally so it's available everywhere and your coding agents pick it up:

npm i -g @astryxdesign/cli

From there, the simplest setup is a few CSS imports plus a theme provider—no build plugin, no PostCSS or Babel config required. You can poke around before committing to anything: there's a live Storybook, a sandbox playground, and full docs at astryx.atmeta.com. The source lives at github.com/meta/astryx, and there's a Discord if you want to ask questions directly.

Final Thoughts

Astryx is worth a look if you're starting a new React 19 project, evaluating design systems that don't lock you into a styling stack, or—more interestingly—if you're working with AI coding assistants and want them to generate code that actually matches your component library. The eight years of internal battle-testing across 13,000+ apps is a meaningful track record, and the open internals plus CSS-variable theming are the kind of decisions that pay off six months in, not on day one. It's in beta, so treat it accordingly, but the architecture suggests the team thought hard about where design systems usually hurt.

Follow @githubprojects for more developer tools and open source projects.