ASTRYX : le design system de Meta pensé pour les humains et les agents
📌 ASTRYX est un design system open source pour React qui fournit plus de 160 composants accessibles, des thèmes personnalisables, des templates et des outils conçus pour être utilisés aussi bien par des développeurs que par des agents IA.
Le projet est né chez Meta, où il aurait servi pendant huit ans et alimenté plus de 13 000 applications. Sa version publique rassemble les briques habituelles d’un produit moderne : boutons, champs, menus, tableaux, dialogues, navigation, thèmes clair et sombre, mise en page et patterns prêts à reprendre. L’ensemble s’accompagne d’une documentation et d’un playground qui permettent de voir les composants avant de les intégrer.
Astryx utilise StyleX pour écrire ses styles, mais cette décision reste largement invisible pour les utilisateurs. Les composants acceptent className et peuvent être adaptés avec Tailwind, CSS Modules ou du CSS classique. Le système cherche donc à apporter une base cohérente sans obliger chaque projet à adopter toute une nouvelle chaîne de styling.
- 🧩 Plus de 160 composants React
- ♿ Accessibilité et navigation clavier intégrées
- 🎨 Thèmes prêts à personnaliser
- 📐 Patterns et templates de production
- 🤖 Documentation et CLI adaptées aux agents
- 🛠️ Possibilité d’éjecter le code source
Je trouve la partie « agent ready » plus intéressante que le simple chiffre de composants. Astryx tente de rendre l’API, la documentation, le CLI et les exemples suffisamment réguliers pour qu’un agent puisse prédire comment utiliser un composant inconnu. L’objectif est de donner les mêmes repères à une personne et à l’IA qui travaille à côté d’elle.
L’installation reste légère : les composants et thèmes sont publiés en paquets npm, sans plugin de build obligatoire ni configuration Babel ou PostCSS pour commencer. Le CLI peut lister les composants, fournir la documentation, générer des thèmes et échafauder des éléments. Les projets peuvent ainsi commencer avec une base neutre, puis adapter les variables CSS sans forker la source des composants.
bash
npm install @astryxdesign/core @astryxdesign/theme-neutral
npm install -D @astryxdesign/cli
Astryx est actuellement en bêta, sous licence MIT. Certaines briques expérimentales ou graphiques sont encore publiées uniquement sous un canal canary. Cette limite est importante pour une adoption en production, même si l’origine Meta et les années d’usage interne donnent au projet une base plus solide qu’un kit de composants lancé récemment.
ASTRYX se place finalement entre une bibliothèque UI et une méthode de travail. Il fournit les composants, mais surtout les conventions, les thèmes et le contexte nécessaires pour construire plus vite sans abandonner la personnalisation. Une proposition ambitieuse, particulièrement adaptée aux équipes qui commencent à faire travailler leurs agents directement dans le design system.
