meta/astryx

What it is

Astryx is an open-source design system for React 19+ and StyleX, currently in beta. It grew inside Meta over eight years and is now released under MIT; it ships 150+ accessible components, brand theming, dark mode, templates, and a CLI as one system (20).

The design centers on open internals: building blocks are exported directly, and swizzle ejects a component's source into your project. Styles are authored in StyleX but that is invisible to consumers, so you can override with className using Tailwind, CSS modules, or plain CSS. A theme is a set of CSS custom property overrides, so customization does not require wrapping or forking components. The API, docs, and CLI are deliberately kept consistent so that people and AI assistants build with the same reference (20).

It is for React teams that want a batteries-included component library without adopting a styling system or build plugin.

Quick start

Astryx requires React 19 or later; react and react-dom are peer dependencies. Install the core package, a theme, its peer dependency, and the CLI (21):

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

Optionally install the CLI globally so astryx works in any folder and coding agents can find it; inside a project it still runs the project's own version (23):

npm i -g @astryxdesign/cli

The simplest setup is a few CSS imports plus a theme provider, with no build plugin and no PostCSS or Babel config. The core package README covers the full guide for Next.js, Tailwind, Vite, and CDN. To make CLI invocation reliable for AI assistants and new developers, add a script (25):

"scripts": {
  "astryx": "node node_modules/@astryxdesign/cli/clients/cli/bin/astryx.mjs"
}

Then run npm run astryx -- component --list to list components.

Packages

The system is split into four published groups: @astryxdesign/core for components, theming, and utilities; @astryxdesign/cli for docs, templates, scaffolding, themes, and codemods; @astryxdesign/build for StyleX source-build plugins; and seven ready-made themes (neutral, butter, chocolate, matcha, stone, gothic, y2k) (26). Experimental lab components are internal, and the Vega chart wrapper and chart components are npm-only under the @canary dist-tag with no stable release yet.

Constraints

• React 19 or later is required; older React versions are not supported.
• The project is in beta, so APIs may still change.
• Astryx authors styles with StyleX but does not require consumers to adopt it; overrides work through className with Tailwind, CSS modules, or plain CSS.
• Contributors need Node 22+ on an active LTS line and pnpm 11; corepack enable && pnpm install is the documented bootstrap path (48).
• The chart packages have no stable release; only a @canary dist-tag exists.

HotRepo's take

On 2026-11-06 Astryx recorded 14,022 stars and 1,162 forks, gaining 181 stars in the daily window and reaching 7th place on the TypeScript daily list. That is a strong single-day result for a beta design system, but one snapshot only establishes that day's position; it is not evidence of a sustained trend. The notable structural point is the explicit pairing of human and agent workflows across API, docs, and CLI, which is unusual for a component library and worth watching as the beta matures.