https://github.com/lannodev/angular-tailwind
Angular & Tailwind CSS Admin Dashboard Starter Kit, Free and Open Source
https://github.com/lannodev/angular-tailwind
admin-dashboard angular collaborate dashboard free open-source student-vscode tailwind tailwind-css tailwindcss
Last synced: 7 days ago
JSON representation
Angular & Tailwind CSS Admin Dashboard Starter Kit, Free and Open Source
- Host: GitHub
- URL: https://github.com/lannodev/angular-tailwind
- Owner: lannodev
- License: mit
- Created: 2022-03-24T18:07:07.000Z (about 3 years ago)
- Default Branch: main
- Last Pushed: 2025-03-19T00:03:04.000Z (27 days ago)
- Last Synced: 2025-03-31T20:05:18.154Z (14 days ago)
- Topics: admin-dashboard, angular, collaborate, dashboard, free, open-source, student-vscode, tailwind, tailwind-css, tailwindcss
- Language: TypeScript
- Homepage: https://at.lanno.dev
- Size: 13.5 MB
- Stars: 438
- Watchers: 20
- Forks: 166
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- Contributing: CONTRIBUTING.md
- Funding: .github/FUNDING.yml
- License: LICENSE
Awesome Lists containing this project
- awesome-tailwindcss - Angular-Tailwind - Dashboard starter kit using Angular and Tailwind CSS. (Starters & Themes)
- awesome-angular - angular-tailwind - Angular & Tailwind CSS Admin Dashboard Starter Kit. (Table of contents / Angular)
- fucking-awesome-angular - angular-tailwind - Angular & Tailwind CSS Admin Dashboard Starter Kit. (Table of contents / Angular)
- fucking-awesome-angular - angular-tailwind - Angular & Tailwind CSS Admin Dashboard Starter Kit. (Table of contents / Angular)
- trackawesomelist - angular-tailwind (⭐258) - Angular & Tailwind CSS Admin Dashboard Starter Kit. (Recently Updated / [Jul 09, 2024](/content/2024/07/09/README.md))
README
#### Motivation
For me, the best strategy for learning new skills is to practice. I have created this project to learn more about Tailwind CSS using my favorite framework (Angular). I have to tell you, Tailwind is amazing!
The project is not finished yet!
See [Demo](https://at.lanno.dev) page.
#### Versions
#### Features
- [x] Sidebar
- [x] Dark Theme
- [x] Navbar
- [x] Footer
- [x] Auth Module
- [x] Dashboard Module
- [x] Standalone components
- [x] Angular Signals
- [x] Multi Theme
- [x] Tests E2E
- [x] RTL support
- [ ] Guards
- [ ] Animations
- [ ] Jasmine tests
#### Commands
| command | What it does? |
| ------------------------- | :-------------------------------------------- |
| `npm start` | Starts the server in dev mode |
| `npm run lint` | Runs ESLint on project |
| `npm run prettier` | Runs prettier on entire src folder |
| `npm run prettier:verify` | Runs prettier-check and throws error if fails |
| `npm run prettier:staged` | Runs prettier on only staged (changed) files |
| `npm run test:e2e` | Runs playwright e2e test with UI |
#### Dependencies
| Package | What it does? | Link |
| ------------------ | :------------------------------------------------------------------------------------------ | :----------------------------------------------------- |
| `angular-svg-icon` | Provides a means to inline SVG files to allow for them to be easily styled by CSS and code. | [Here](https://www.npmjs.com/package/angular-svg-icon) |
| `apexcharts` | Modern & Interactive Open-source Charts | [Here](https://www.npmjs.com/package/apexcharts) |
| `ng-apexcharts` | Angular wrapper for ApexCharts to build interactive visualizations in Angular. | [Here](https://www.npmjs.com/package/ng-apexcharts) |
#### Dev Dependencies
| Package | What it does? | Link |
| ----------------------------- | :------------------------------------------------------------------------------------------------------- | :---------------------------------------------------------------- |
| `prettier` | An opinionated code formatter | [Here](https://www.npmjs.com/package/prettier) |
| `prettier-plugin-tailwindcss` | A Prettier plugin for Tailwind CSS that automatically sorts classes based on our recommended class order | [Here](https://www.npmjs.com/package/prettier-plugin-tailwindcss) |
| `tailwind-scrollbar` | Tailwind plugin for styling scrollbars. | [Here](https://www.npmjs.com/package/tailwind-scrollbar) |
| `tailwindcss` | A utility-first CSS framework for rapidly building custom user interfaces. | [Here](https://www.npmjs.com/package/tailwindcss) |
#### Icons and Patterns
This project use [Hero Icons](https://heroicons.com/) , [Hero Patterns](https://heropatterns.com/) and [Popsys illustrations](https://popsy.co/)
#### Sponsors ❤️
Check out our awesome sponsors!
[
](https://github.com/jhonnygarcia)
[
](https://github.com/ramses-i)
[
](https://github.com/walteribanez555)
### Repo Activity
#### Disclaimer
The Tailwind name and logos are trademarks of Tailwind Labs Inc.
The Angular name and logos are trademarks of Google.