tailwindlabs / tailwindcss
github.com·23h ago
Developer Tools
GitHub Trending·Jun 30·5 min read
facebook / astryx
TL;DR
Design systems often lack customization and adaptability for diverse user needs. Astryx, an open source design system developed at Meta, addresses this by providing a fully customizable framework.
✦ Why It Matters
Engineers can leverage Astryx to create tailored user interfaces that enhance collaboration and efficiency in their projects.
Key Takeaways
- Install Astryx with npm, pnpm, or yarn for quick setup.
- Utilize the CLI for component documentation and scaffolding.
- Override styles easily without being locked into a specific methodology.
- Contribute to Astryx by following the guidelines in the repository.
Full Summary
Astryx, a design system created within Meta over eight years, has become the largest and most utilized system in the company, supporting more than 13,000 applications. It features over 150 accessible components, brand-level theming, and a command-line interface (CLI) for easy integration.
Built on React and StyleX, Astryx allows developers to import pre-built CSS and use typed React components without needing additional styling libraries. Its open internals enable deep customization, while the absence of styling lock-in allows users to apply their existing CSS methodologies.
The system is designed for both human developers and AI assistants, ensuring they can work together effectively using the same tools and documentation. Astryx emphasizes strong conventions and guidance over enforcement, making it easier for users to adapt and contribute.