Meta, 8년 개발한 디자인 시스템 'Astryx' 오픈소스 공개

핵심 요약

• Meta가 내부에서 8년간 개발한 디자인 시스템 Astryx를 오픈소스로 공개했으며, 현재 베타 단계다.
• React 19+와 StyleX를 기반으로 150개 이상의 접근성 있는 컴포넌트, 브랜드 수준의 테마, 다크 모드, CLI 등을 제공한다.
• Meta 내부에서 13,000개 이상의 앱을 지원하는 회사 최대 규모 디자인 시스템으로 사용되고 있다.
• Astryx는 빌드 플러그인 없이 사전 구성된 CSS와 타입 지정 React 컴포넌트를 제공하며, 사람과 AI 어시스턴트가 동일한 도구로 작업할 수 있도록 설계됐다.
• 컴포넌트는 모든 수준에서 조합 가능하며 swizzle 기능으로 소스 코드를 프로젝트에 추출해 소유할 수 있다.
• Tailwind, CSS 모듈, 순수 CSS 등 기존 스타일링 방식으로 className을 통해 스타일을 자유롭게 오버라이드할 수 있다.
• CSS 커스텀 프로퍼티 오버라이드만으로 테마를 커스터마이징할 수 있으며, 컴포넌트 소스를 포킹하지 않고도 디자이너가 맞춤 설정할 수 있다.
• 7가지 사전 제작 테마(neutral, butter, chocolate, matcha, stone, gothic, y2k)를 제공한다.
• @astryxdesign/core, @astryxdesign/cli, @astryxdesign/build, 테마 패키지로 구성되어 있다.
• API와 컨벤션은 사람과 AI가 동일하게 작업할 수 있도록 함께 설계되었으며, 모든 컴포넌트가 일관된 명명법과 props 규칙을 따른다.
• Node 22+ LTS와 pnpm 11을 사용하며, MIT 라이선스로 공개되어 있다.
• Discord 커뮤니티를 통해 기여자 지원과 API 및 디자인 컨벤션, 컴포넌트 라이프사이클 등의 상세한 가이드를 제공한다.