What problem it solves

Teams need consistent, accessible interface foundations without locking themselves into a closed component API or a particular styling approach. They also need a shared design reference that people and AI assistants can use in the same way.

Key features

• Composable component internals — Components expose their building blocks and can be composed at different levels. When deeper customization is needed, swizzle can eject a component's complete source into the project.

  Source: README, packages

• Styling flexibility — Astryx authors its styles with StyleX while keeping that implementation invisible to consumers. Projects can override components with Tailwind, CSS modules, plain CSS, or an existing className approach.

  Source: README

• Theme customization — Themes are implemented as CSS custom property overrides, allowing design changes without forking the project or wrapping component source.

  Source: README, packages/themes

• Accessible components and patterns — The system provides typed React components, foundations, and reusable patterns for common interface workflows. The README describes more than 150 reusable UI building blocks with full TypeScript support.

  Source: README

• CLI and shared tooling — The CLI provides component documentation, templates, scaffolding, themes, and codemods. Its documentation and component listing are intended to support the same workflow for people and AI assistants.

  Source: README

Quick start

Copied verbatim from the project's README.

# 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

npm i -g @astryxdesign/cli

Who it may suit

This project may suit React teams seeking accessible components, theming, and tooling that can be customized without adopting a separate styling library. It may also suit teams that want people and AI assistants to work from the same component reference.

Topics to discuss

• Which composition and customization patterns should be documented more clearly for teams adopting Astryx?

• How should themes evolve to support brand customization while remaining understandable and consistent?

• What conventions would make Astryx more predictable for both developers and AI assistants?

Written by ReadmeX AI from the project's README, source and public GitHub data; it may contain mistakes.

Read the original README https://github.com/meta/astryx#readme

ReadmeX opened this community for a trending project; it is not run by the project. Maintainers can claim it from the community page.