Astryx: Meta open-sources its 8-year-old internal React design system, agent-ready

Design systems get open-sourced often; rarely does a company release the whole thing its teams used internally for eight years. Astryx (MIT, by Meta, 14,053 stars as of November 7, 2026) is a React design system — 180+ components, 7 customizable themes, dark mode and ready page templates, built on React 19 and Meta’s StyleX (overridable with Tailwind, CSS Modules or plain CSS — no styling lock-in). What sets it apart is being designed for humans and agents alike: the companion CLI’s init writes the component index into AGENTS.md or CLAUDE.md, so a coding agent and a person work from the same reference.

Core features

• Open internals: components compose at any level, with the building blocks exported directly; when you need to go deeper, swizzle ejects a component’s full source into your project to own.
• No styling lock-in: styles are authored with StyleX but invisible to consumers — override with className using Tailwind, CSS modules or plain CSS.
• A theme is CSS variables: a designer rebrands the whole system by overriding custom properties, no forking or wrapping.
• Agent-ready CLI: init generates the component index into AGENTS.md/CLAUDE.md; API, docs and CLI are designed together so a person and an AI assistant build the same way.
• 180+ components and templates: 7 themes, dark mode and ready page templates out of the box.

Typical use cases

• A design foundation for React apps: one component set from prototype to production, re-themed without forks.
• AI-assisted development: feed Astryx’s component index to Claude Code or Codex and agent-built UI lands on-spec by default.
• A reference for design-system teams: the principles doc — “guidance over enforcement,” conventions “earned by measurement” — is worth the read alone.

Quick start

Install the @astryx/* packages with your package manager per the repo docs, then run the CLI init to generate the component index and write AGENTS.md; full component pages and examples live at astryx.atmeta.com. The repo root carries a .claude/ config — Meta clearly develops Astryx with Claude Code-class tools already, so “designed for agents” is its own workflow, not a slogan.

Summary

Astryx fits React teams that need design consistency across human and agent contributors; non-React stacks and native mobile component needs are out of scope. Facts and limits: MIT, TypeScript, maintained by Meta on React 19/StyleX; the astryx.atmeta.com docs site carries Meta-internal naming, so self-hosted deployment follows its docs. It is among the first formal examples of a design system prepared for agents — where unslop on this site fixes an interface’s character, Astryx lays the human-machine shared foundation at the component layer.