https://github.com/william-mba/tailwind-ng
Tailwind CSS components for Angular.
https://github.com/william-mba/tailwind-ng
angular css developer frontend ngxtw tailwind-css tailwindcss tailwindui typescript web webapp webapplication webcomponents
Last synced: 7 months ago
JSON representation
Tailwind CSS components for Angular.
- Host: GitHub
- URL: https://github.com/william-mba/tailwind-ng
- Owner: william-mba
- License: mit
- Created: 2024-05-26T05:30:01.000Z (over 1 year ago)
- Default Branch: next
- Last Pushed: 2025-03-31T13:15:00.000Z (7 months ago)
- Last Synced: 2025-03-31T13:23:33.153Z (7 months ago)
- Topics: angular, css, developer, frontend, ngxtw, tailwind-css, tailwindcss, tailwindui, typescript, web, webapp, webapplication, webcomponents
- Language: TypeScript
- Homepage: https://tailwind-ng.com
- Size: 93 MB
- Stars: 12
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
- Security: SECURITY.md
Awesome Lists containing this project
- fucking-awesome-angular - tailwind-ng - An open source UI components library that aims to provide a seamless and robust integration of Tailwind CSS components with Angular to make building a great UI easier and joyful at any scale. (Third Party Components / UI Libraries built on Tailwind CSS)
- awesome-angular - tailwind-ng - An open source UI components library that aims to provide a seamless and robust integration of Tailwind CSS components with Angular to make building a great UI easier and joyful at any scale. (Third Party Components / UI Libraries built on Tailwind CSS)
README
Beautiful, fast and accessible
Tailwind CSS components for Angular.
[](https://dev.azure.com/artandev/Labs/_build/latest?definitionId=2&branchName=main)
 
## Motivation
Like [Tailwind UI](https://tailwindui.com/) does for React and Vue, **Tailwind NG** levarage the power of TypeScript, [Tailwind CSS](https://tailwindcss.com/)
and [Angular](https://angular.dev) to enable you to build **great Angular applications** at any scale **without hassles**.
## Why Tailwind NG ?
- **Beautiful**: Expertly-crafted UI components that look great out of the box.
- **Fast**: Optimized for large-scale and enterprise Angular applications.
- **Reliable**: Well-tested to ensure consistent performance and reliability.
- **Accessible**: Accessibility features compliant with [W3C WAI-ARIA](https://www.w3.org/TR/wai-aria/) standards out of the box.
- **Customizable**: Fully-customizable and predictable components to fit your specific needs.
## Packages reference
Tailwind NG is modular and is composed of the following packages:
| Name | Description | Version (latest) | Size (min+zip) |
| --------------------------------------------- | ------------------------------------------------------------------------------------ | --------------------------------------------------------- | ----------------------------------------------------- |
| [tailwind-ng][tailwind-ng-npm] | Provides a set of well-designed UI components out of the box. | ![tailwind-ng-version][tailwind-ng-version] | ![tailwind-ng-size][tailwind-ng-minzip] |
| [@tailwind-ng/core][tailwind-ng-core-npm] | Provides core utilities and abstractions. | ![tailwind-ng-core-version][tailwind-ng-core-version] | ![tailwind-ng-core-size][tailwind-ng-core-minzip] |
| [@tailwind-ng/themes][tailwind-ng-themes-npm] | Provides a set of pre-built themes available via the CDN and npm. | ![tailwind-ng-themes-version][tailwind-ng-themes-version] | ![tailwind-ng-themes-size][tailwind-ng-themes-minzip] |
| @tailwind-ng/icons | This package will provides a set of reusable icons from Heroicons and googles fonts. | TODO | TODO |
## Acknowledgements
Tailwind NG is made possible thanks to the inspirations from the following projects:
- [Tailwind UI](https://tailwindui.com/)
- [Material Design](https://m3.material.io/)
[tailwind-ng-version]: https://badgen.net/npm/v/tailwind-ng
[tailwind-ng-npm]: https://www.npmjs.com/package/tailwind-ng
[tailwind-ng-minzip]: https://badgen.net/bundlephobia/minzip/tailwind-ng
[tailwind-ng-core-npm]: https://www.npmjs.com/package/@tailwind-ng/core
[tailwind-ng-core-version]: https://badgen.net/npm/v/@tailwind-ng/core
[tailwind-ng-core-minzip]: https://badgen.net/bundlephobia/minzip/@tailwind-ng/core@latest
[tailwind-ng-themes-npm]: https://www.npmjs.com/package/@tailwind-ng/themes
[tailwind-ng-themes-version]: https://badgen.net/npm/v/@tailwind-ng/themes
[tailwind-ng-themes-minzip]: https://badgen.net/bundlephobia/minzip/@tailwind-ng/themes@latest
