Awesome
<div align="center"><img src="projects/demo/src/assets/images/taiga.svg" alt="taiga ui logo" width="36px"> Taiga UI
Website • Documentation • Core team • Figma
</div>Taiga UI is fully-treeshakable Angular UI Kit consisting of multiple base libraries and several add-ons.
It is based on ng-polymorpheus dynamic content approach and uses Web APIs for Angular for required browser APIs.
Why Taiga UI
🧩 Modular and fully-treeshakable. We harnessed the power of Secondary Entry Points mechanism. You can import even just one entity from our library and be sure that there is no redundant code in your bundle
🧙 Agnostic. Our components are very flexible and are ready for any use case. But we take care of basic UX aspects to let you focus on your project features
🦋 Customizable. We use CSS custom properties for all our styling and provide easy methods to customize all UI components
🛠 Well engineered. We are not afraid to use DI to the max. All our components use OnPush, and the whole project
is developed with strict TypeScript mode
📦 It's big! We have 130+ components, 100+ directives, dozens of tokens, utils and tools. And it isn't over yet 🚀
🏗 Maintained! The library started as an internal product in our company. It is used by 50+ projects in production now, and it is here to stay.
Read more about Taiga UI main features in this article on inDepth
Version compatibility
| Taiga UI | Angular | Supported | Latest version (npm) |
|---|---|---|---|
4.x.y | ^16.0.0 - latest | ✅ Current |  |
3.x.y | ^12.0.0 - latest | ✅ Long-term support (LTS) |  |
2.x.y | ^9.0.0 - ^15.0.0 | ⚠️ No longer supported |  |
How to start
See our Getting started page to start working with Taiga UI
You can also use our StackBlitz starter to create a quick sample with Taiga UI
🎨 Check out Taiga UI Figma library which you can use to design your app with Taiga UI components.
Community
💡 Your ideas are very welcome in Github issues or discussions
🗨 For English live chat join #taiga-ui channel in official Angular discord
💬 For Russian live chat join taiga_ui Telegram group
Contributing
See our CONTRIBUTING.md guide. Try to make pull request online from Web IDE.
Core team
<table> <tr> <td align="center"> <a href="https://twitter.com/waterplea" ><img src="https://github.com/waterplea.png?size=200" width="100" style="margin-bottom: -4px; border-radius: 8px;" alt="Alex Inkin" /><br /><b> Alex Inkin </b></a > <div style="margin-top: 4px"> <a href="https://twitter.com/waterplea" title="Twitter" ><img width="16" src="https://raw.githubusercontent.com/MarsiBarsi/readme-icons/main/twitter.svg" /></a> <a href="https://github.com/waterplea" title="Github" ><img width="16" src="https://raw.githubusercontent.com/MarsiBarsi/readme-icons/main/github.svg" /></a> <a href="https://t.me/waterplea" title="Telegram" ><img width="16" src="https://raw.githubusercontent.com/MarsiBarsi/readme-icons/main/send.svg" /></a> </div> </td> <td align="center"> <a href="https://twitter.com/marsibarsi" ><img src="https://github.com/marsibarsi.png?size=200" width="100" style="margin-bottom: -4px; border-radius: 8px;" alt="Roman Sedov" /><br /><b> Roman Sedov </b></a > <div style="margin-top: 4px"> <a href="https://twitter.com/marsibarsi" title="Twitter" ><img width="16" src="https://raw.githubusercontent.com/MarsiBarsi/readme-icons/main/twitter.svg" /></a> <a href="https://github.com/marsibarsi" title="GitHub" ><img width="16" src="https://raw.githubusercontent.com/MarsiBarsi/readme-icons/main/github.svg" /></a> <a href="https://t.me/marsibarsi" title="Telegram" ><img width="16" src="https://raw.githubusercontent.com/MarsiBarsi/readme-icons/main/send.svg" /></a> </div> </td> <td align="center"> <a href="https://github.com/vladimirpotekhin" ><img src="https://github.com/vladimirpotekhin.png?size=200" width="100" style="margin-bottom: -4px; border-radius: 8px;" alt="Vladimir Potekhin" /><br /><b>Vladimir Potekhin</b></a > <div style="margin-top: 4px"> <a href="https://twitter.com/v_potekhin" title="Twitter" ><img width="16" src="https://raw.githubusercontent.com/MarsiBarsi/readme-icons/main/twitter.svg" /></a> <a href="https://github.com/vladimirpotekhin" title="GitHub" ><img width="16" src="https://raw.githubusercontent.com/MarsiBarsi/readme-icons/main/github.svg" /></a> <a href="https://t.me/v_potekhin" title="Telegram" ><img width="16" src="https://raw.githubusercontent.com/MarsiBarsi/readme-icons/main/send.svg" /></a> </div> </td> <td align="center"> <a href="https://www.linkedin.com/in/nsbarsukov/" ><img src="https://github.com/nsbarsukov.png?size=200" width="100" style="margin-bottom: -4px; border-radius: 8px;" alt="Nikita Barsukov" /><br /><b>Nikita Barsukov</b></a > <div style="margin-top: 4px"> <a href="https://twitter.com/nsbarsukov" title="Twitter" ><img width="16" src="https://raw.githubusercontent.com/MarsiBarsi/readme-icons/main/twitter.svg" /></a> <a href="https://github.com/nsbarsukov" title="GitHub" ><img width="16" src="https://raw.githubusercontent.com/MarsiBarsi/readme-icons/main/github.svg" /></a> <a href="https://t.me/nsbarsukov" title="Telegram" ><img width="16" src="https://raw.githubusercontent.com/MarsiBarsi/readme-icons/main/send.svg" /></a> </div> </td> <td align="center"> <a href="https://github.com/mdlufy" ><img src="https://github.com/mdlufy.png?size=200" width="100" style="margin-bottom: -4px; border-radius: 8px;" alt="German Panov" /><br /><b>German Panov</b></a > <div style="margin-top: 4px"> <a href="https://github.com/mdlufy" title="GitHub" ><img width="16" src="https://raw.githubusercontent.com/MarsiBarsi/readme-icons/main/github.svg" /></a> <a href="https://t.me/mdlufy" title="Telegram" ><img width="16" src="https://raw.githubusercontent.com/MarsiBarsi/readme-icons/main/send.svg" /></a> </div> </td> <td align="center"> <a href="https://github.com/splincode" ><img src="https://github.com/splincode.png?size=200" width="100" style="margin-bottom: -4px; border-radius: 8px;" alt="Maksim Ivanov" /><br /><b>Maksim Ivanov</b></a > <div style="margin-top: 4px"> <a href="https://twitter.com/splincodewd" title="Twitter" ><img width="16" src="https://raw.githubusercontent.com/MarsiBarsi/readme-icons/main/twitter.svg" /></a> <a href="https://github.com/splincode" title="GitHub" ><img width="16" src="https://raw.githubusercontent.com/MarsiBarsi/readme-icons/main/github.svg" /></a> <a href="https://t.me/splincode" title="Telegram" ><img width="16" src="https://raw.githubusercontent.com/MarsiBarsi/readme-icons/main/send.svg" /></a> </div> </td> </tr> </table>License
🆓 Feel free to use our library in your commercial and private applications
All Taiga UI packages are covered by Apache 2.0
Read more about this license here