Built with Astro, with interface components from Flowbite and styling based on Tailwind CSS atomic classes
AstroAdmin dashboard
flowbite-astro-admin-dashboard — Astro Admin dashboard Template
By themesberg
A free, open-source admin dashboard template built with Astro, Flowbite, and Tailwind CSS, featuring example pages for charts, tables, CRUD layouts, modals, and drawers.
Explore the design
Compare the page layouts and mobile experience. Open any screenshot for a closer look.
Desktop homepage1 / 3
Desktop captureTop of page
Actual screenshot captured by the server browser.
All pages & views 3
Screenshots show visual appearance; interactive behavior may differ.
Recorded 2026-10-02View source
What stands out
A quick read of the recorded project description.
Provides example pages such as dashboard, stacked layout, product and user CRUD, settings, and pricing
Includes common admin interface elements such as charts, tables, widgets, modals, and drawers
Comes with authentication and status pages such as login, registration, password reset, forgot password, locked profile, maintenance, 404, and 500
Released under the MIT license, allowing free use, modification, commercial use, and distribution of this version of the code
Template Details
This is a free, open-source admin dashboard UI template that uses Astro as the site framework, Flowbite for interface components, and Tailwind CSS atomic classes for styling. The template provides example pages including a dashboard, stacked layout, product and user CRUD pages, settings, pricing, as well as login, registration, password reset, forgot password, locked profile, maintenance, 404, and 500 pages. It also includes interface elements such as charts, tables, widgets, modals, and drawers.
The repository is released under the MIT license, allowing free use, modification, commercial use, and distribution of this version of the code, provided that the copyright notice and the full MIT license notice are retained when distributing. The code is provided as is. Third-party assets such as demo images, fonts, and icons require separate verification under their respective licenses. External services such as domain, hosting, database, payment, or AI may incur additional charges.
The template is positioned as a front-end interface starting point and does not include backend business logic or data persistence implementation; the CRUD pages are interface examples, and integrating real data requires implementing your own server and APIs.
AstroBackend
Is it right for your project?
Use Cases
- Building a front-end interface skeleton for internal management tools or SaaS backends
- Reusing Flowbite and Tailwind CSS admin components and page layouts in an Astro project
- Serving as a reference example for learning to develop admin interfaces with Astro and Tailwind CSS
- Quickly demonstrating common admin page forms such as dashboards, CRUD lists, and authentication flows
Suitable For
- Developers who need a ready-made admin UI template to shorten front-end setup time
- Teams using the Astro or Tailwind CSS technology stack
- Developers who want to see how Flowbite components are organized in admin scenarios
Getting started & customization
Use these recorded setup notes alongside the repository instructions for your chosen version.
- 1
The repository provides StackBlitz and CodeSandbox online entry points to view the project directly in the browser
- 2
Local development requires installing dependencies and starting according to the README's Quick start and Workflow instructions
- 3
Pages such as CRUD are interface examples; integrating real data requires implementing your own server and APIs
- 4
Third-party assets such as demo images, fonts, and icons require separate verification under their respective licenses
License & source material
Usage conditions & limitations
Free to use · keep license noticeThis entry covers the free version under the MIT license in the public repository; the free scope is the code of this version and does not imply that external services or third-party assets are free.
Must comply with when using
- Free use, modification, commercial use, and distribution of this version of the code are permitted.
- When distributing copies or substantial portions of the code, retain the original author's copyright notice and the full MIT license notice.
- The code is provided as is; warranties and limitations of liability are governed by the original license and applicable law.
Additional costs & items to verify
- The README mentions Flowbite Pro as a larger paid collection, which is an optional paid upgrade; the free version does not include Pro components and blocks.
- The Flowbite component library has its own separate license page; using its components requires complying with that license as well, alongside the repository's own MIT license.
- The template design is based on the Flowbite design system; Figma design resources may be subject to separate terms and require your own verification.
- Some components, such as charts, come from third-party libraries like ApexCharts, which have their own licenses and require separate verification.
- Demo images, fonts, icons, and other third-party assets require verification under their respective licenses and cannot be judged solely by the code's MIT license.
- External services such as domain, hosting, database, payment, or AI may incur additional charges.
View Original Text Basis
Permission is hereby granted, free of charge
Original License Text
Flowbite Pro
Original README
License Agreement: <https://flowbite.com/docs/getting-started/license/>
Original README
based on the [Flowbite Design System](https://flowbite.com/figma/)
Original README
https://github.com/themesberg/flowbite-astro-admin-dashboard/blob/main/LICENSEhttps://github.com/themesberg/flowbite-astro-admin-dashboard/blob/main/README.mdfrom other third-party libraries such as ApexCharts
Original README
Compiled by DeepSeek based on repository license and README ·2026-10-02. Results only cover the materials read; dependencies, images, fonts, and subsequent term changes are subject to their respective original texts.
Project checks & description sources
Template Information
- Source platforms
- GitHub
- Documentation and maintenance reference score
- More documented · 76 / 100
- Technologies
- Astro
- Website type
- Admin dashboard
How this score is calculated
Our heuristic uses license records (up to 30), a demo link (12), a preview (10), stars (15), recorded maintenance (15), description completeness (8), feature records (5) and classification data (5). It is not a code, security or performance test, or a Google score. A link does not establish tested functionality.
What to verify for this project
- Repository update recorded
- 2023-12-09
- Screenshot last checked
- 2026-10-02
A demo link is listed. Check it with your own content and viewport sizes; its presence does not confirm that forms, authentication or payments work.
The catalog identifies Astro as the primary stack. Check the actual dependency manifest and lockfile for versions and hosting requirements. These notes use recorded metadata, not a code audit or a deployment test.
Use a selection guide →How this description was prepared
AI-assisted description based on catalog records and repository material. Repository authors are not automatically the reviewers of this description.
Automatically checked against source and license rules; no manual editorial review.
Inspect the recorded source material
SHA-256: edd868348754a104f7924323bb8b2374ffe6775e691599be2b6de833e5695baf
2026-10-02T07:12:33.569Z
Source file / repository# [Flowbite Astro Admin Dashboard](https://themesberg.github.io/flowbite-astro-admin-dashboard/) [](https://twitter.com/intent/tweet?url=https%3A%2F%2Fgithub.com%2Fthemesberg%2Fflowbite-astro-admin-dashboard&text=Check%20out%20this%20open-source%20admin%20dashboard%20built%20with%20Flowbite%2C%20Astro%20and%20Tailwind%20CSS)
<!-- NOTE: This is a Tailwind in MD experiment, to make it nice when rendered with Astro -->
<div align="center" class="flex flex-wrap justify-evenly w-full">
<a href="https://github.com/themesberg/flowbite-astro-admin-dashboard"><img src="https://img.shields.io/badge/version-v1.0.2-blue" alt="version"></a>
<a href="LICENSE"><img src="https://img.shields.io/badge/license-MIT-blue.svg" alt="license"></a>
<a href="https://github.com/themesberg/flowbite-admin-dashboard/issues?q=is%3Aopen+is%3Aissue"><img src="https://img.shields.io/github/issues/themesberg/flowbite-astro-admin-dashboard.svg" alt="GitHub issues open"></a>
<a href="https://github.com/themesberg/flowbite-admin-dashboard/issues?q=is%3Aissue+is%3Aclosed"><img src="https://img.shields.io/github/issues-closed-raw/themesberg/flowbite-astro-admin-dashboard.svg" alt="GitHub issues closed"></a>
</div>
<a class="hidden" href="https://themesberg.github.io/flowbite-astro-admin-dashboard/"><img class="w-full rounded-md overflow-hidden" src="https://flowbite.s3.amazonaws.com/templates/flowbite-admin-dashboard/flowbite-admin-dashboard-preview.png" alt="Flowbite Admin Dashboard Live Preview"></a>
This project is a free and open-source UI admin dashboard template built with the components from [Flowbite](https://github.com/themesberg/flowbite) and based on the utility-first [Tailwind CSS](https://github.com/tailwindlabs/tailwindcss) framework featuring charts, tables, widgets, CRUD layouts, modals, drawers, and more.
This admin dashboard can quickly help you get started building an application for your project using the newest UI/UX development technologies in the open-source area including Tailwind CSS and Flowbite.
---
<div align="center" class="flex flex-wrap justify-evenly w-full my-16">
<a href="https://stackblitz.com/github/themesberg/flowbite-astro-admin-dashboard"><img src="https://developer.stackblitz.com/img/open_in_stackblitz.svg" alt="Open in StackBlitz"></a>
<a href="https://codesandbox.io/p/github/themesberg/flowbite-astro-admin-dashboard/main"><img src="https://assets.codesandbox.io/github/button-edit-lime.svg" alt="Open with CodeSandbox"></a>
</div>
<div class="hidden">
---
## Table of Contents
<details><summary>Click to expand</summary>
- [Table of Contents](#table-of-contents)
- [🕹 Demo pages](#-demo-pages)
- [🌀 Built with Flowbite](#-built-with-flowbite)
- [💨 Tailwind CSS utility classes](#-tailwind-css-utility-classes)
- [📊 15 example pages](#-15-example-pages)
- [🧱 Advanced components](#-advanced-components)
- [📚 Flowbite documentation](#-flowbite-documentation)
- [👨🚀 Development](#-development)
- [⚙️ Workflow](#️-workflow)
- [🚀 Quick start](#-quick-start)
- [Project Structure](#project-structure)
- [🛠 Tools](#-tools)
- [Browser Support](#browser-support)
- [Resources](#resources)
- [JavaScript Frameworks](#javascript-frameworks)
- [Back-end Frameworks](#back-end-frameworks)
- [Reporting Issues](#reporting-issues)
- [Technical Support or Questions](#technical-support-or-questions)
- [Licensing](#licensing)
- [Useful Links](#useful-links)
- [Authors](#authors)
</details>
---
</div>
<div class="hidden">
## 🕹 Demo pages
| Dashboard | Stacked Layout | Products (CRUD) |
| --------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| [](http://themesberg.github.io/flowbite-astro-admin-dashboard/) | [](http://themesberg.github.io/flowbite-astro-admin-dashboard/layouts/stacked/) | [](http://themesberg.github.io/flowbite-astro-admin-dashboard/crud/products/) |
| Users (CRUD) | Settings | Pricing page |
| -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| [](http://themesberg.github.io/flowbite-astro-admin-dashboard/crud/users/) | [](http://themesberg.github.io/flowbite-astro-admin-dashboard/settings/) | [](http://themesberg.github.io/flowbite-astro-admin-dashboard/pages/pricing/) |
| Login page | Register page | Reset password |
| ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| [](http://themesberg.github.io/flowbite-astro-admin-dashboard/authentication/sign-in/) | [](http://themesberg.github.io/flowbite-astro-admin-dashboard/authentication/sign-up/) | [](http://themesberg.github.io/flowbite-astro-admin-dashboard/authentication/reset-password/) |
| Forgot password | Profile lock | Maintenance page |
| ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| [](http://themesberg.github.io/flowbite-astro-admin-dashboard/authentication/forgot-password/) | [](http://themesberg.github.io/flowbite-astro-admin-dashboard/authentication/profile-lock/) | [](http://themesberg.github.io/flowbite-astro-admin-dashboard/pages/maintenance/) |
| 404 not found | 500 server error | Playground |
| ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| [](http://themesberg.github.io/flowbite-astro-admin-dashboard/pages/404/) | [](http://themesberg.github.io/flowbite-astro-admin-dashboard/pages/500/) | [](http://themesberg.github.io/flowbite-astro-admin-dashboard/playground/sidebar/) |
- [Live Preview](http://themesberg.github.io/flowbite-astro-admin-dashboard/)
</div>
## 🌀 Built with Flowbite
The interactive components such as the navbars, modals, drawers, and tooltips are all based on the popular [open-source component library called Flowbite](https://flowbite.com/) which enables us to use these elements by creating more complex set of pages and widgets inside a fully-fledged admin dashboard template.
## 💨 Tailwind CSS utility classes
All of the pages, widgets, and components are solely based on the utility-first classes from Tailwind CSS and it is compatible with the latest `v3.x` of the technology by automatically purging all of the classes based on the template paths.
## 📊 15 example pages
Get started with 15 advanced examples pages including two different layouts of a dashboard's homepage full of charts widgets, tables, datepickers, and statistics and also with two CRUD layout pages for products, users, a settings page, authentication pages for login and register and even custom 404 and 500 error pages.
## 🧱 Advanced components
This admin dashboard contains many advanced components both from Flowbite but also from other third-party libraries such as ApexCharts which have been customly tailored with Tailwind CSS classes and designed based on the [Flowbite Design System](https://flowbite.com/figma/).
## 📚 Flowbite documentation
If you want to use this project we recommend to also [study the component library](https://flowbite.com/docs/getting-started/introduction/) that we used to build this dashboard because you can use even more components from that library to enhance the examples that we've coded here already.
## 👨🚀 Development
### ⚙️ Workflow
This product is built using the following widely used technologies:
- Tailwind CSS: [tailwindcss.com](https://tailwindcss.com/)
- Flowbite: [flowbite.com](http://flowbite.com/)
- Astro: [astro.build](https://astro.build/)
### 🚀 Quick start
1. Clone this repository or download the ZIP file
2. Make sure that you have **Node.js** and NPM, PNPM or Yarn installed
3. Install the project dependencies from the `package.json` file:
```sh
pnpm install
# or
npm install
# or
yarn
```
_PNPM is the package manager of choice for illustration, but you can use what you want._
1. Launch the Astro local development server on `localhost:2121` by running the following command:
```sh
pnpm run dev
```
You can also build the project and get the distribution files inside the `dist/` folder by running:
```sh
pnpm run build
```
Then, you can preview the generated build with a local web server:
```sh
pnpm run preview
```
For deployment, see the GitHub workflow, where you can plug your target (pre-configured for GitHub pages).
See [docs.astro.build/en/guides/deploy](https://docs.astro.build/en/guides/deploy)
Website is configured for static deployment, but you can flip it to **Server-Side rendering** by simply
uncommenting `output: "server"` in the `./astro.config.mjs`.
---
### Project Structure
After cloning this repository, you'll find the following (simplified) structure:
```sh
🛬
├── 💧 data
│ └── **/*.json # Satic data sources for REST etc.
│
└── src
│
├── 🧱 app
│ └── **/*.astro # Application-wide components
│
├── 🌠 assets
│ └── **/*.{svg,…} # Transformable assets
│
├── 🧱 components
│ └── **/*.astro # Simple, atomic UI elements
│
├── 📚 lib
│ └── **/*.ts # Utilities (Databases, APIs…)
│
├── 🧱 modules
│ └── **/*.astro # Complex views made of elements
│
├── 📑 pages
│ ├── **/*.astro # File-based client routes
│ │
│ └── 🌐 api
│ └── [...entities].ts # Catch-all endpoint for CRUD ops.
│
├── 🚀 services
│ └── *.ts # Server-side CRUD operations
│
└── 📐 types
└── *.ts # Data entities typings
```
### 🛠 Tools
Efforts have been put on fast **onboarding** and **developer experience**.
This project comes with extensive support for TypeScript, Astro, Tailwind, and VS Code.
It is configured with sensible defaults, a bit of opinions, plus some tricks to make it plays nice together.
- **TypeScript**: _strictest_ Astro's settings. Full-stack, type-safe code base
- **ESLint**: featuring `astro-eslint-parser` + `eslint-plugin-astro`
- **Prettier**: featuring `prettier-plugin-astro` (bundled with `astro`)
- **Editorconfig**: conforming with prettier
- **VS Code**: extensions recommendations, tooling settings
- **Tailwind**: Astro integration (using Vite and PostCSS)
- **Flowbite**: dependencies (core, typography), settings
- **GitHub**: a [pre-configured workflow](https://github.com/themesberg/flowbite-astro-admin-dashboard/tree/main/.github/workflows) for deployment (using PNPM cache)
- **Sandboxes**: project is tested against and fully compatible with web containers
Feel free to hack those settings to cater for your own needs.
<div align="center">
<a href="https://user-images.githubusercontent.com/603498/224380239-0aff9ec2-3436-4fca-a842-230f29dd9677.png"><img class="w-full rounded-md overflow-hidden" alt="ide-tooling" src="https://user-images.githubusercontent.com/603498/224380239-0aff9ec2-3436-4fca-a842-230f29dd9677.png"></a>
<a href="https://user-images.githubusercontent.com/603498/224374764-dd1f98f8-df45-43c0-97f7-4b89ec427628.png"><img class="w-full rounded-md overflow-hidden" alt="gh-workflow" src="https://user-images.githubusercontent.com/603498/224374764-dd1f98f8-df45-43c0-97f7-4b89ec427628.png"></a>
<a href="https://user-images.githubusercontent.com/603498/224353577-51262536-742a-4204-b85f-3f83c209697d.png"><img class="w-full rounded-md overflow-hidden" alt="gh-workflow" src="https://user-images.githubusercontent.com/603498/224353577-51262536-742a-4204-b85f-3f83c209697d.png"></a>
</div>
## Browser Support
At present, we officially aim to support the last two versions of the following browsers:
<div align="center" class="flex justify-between w-full">
<img src="https://s3.amazonaws.com/creativetim_bucket/github/browser/chrome.png" width="64" height="64"> <img src="https://s3.amazonaws.com/creativetim_bucket/github/browser/firefox.png" width="64" height="64"> <img src="https://s3.amazonaws.com/creativetim_bucket/github/browser/edge.png" width="64" height="64"> <img src="https://s3.amazonaws.com/creativetim_bucket/github/browser/safari.png" width="64" height="64"> <img src="https://s3.amazonaws.com/creativetim_bucket/github/browser/opera.png" width="64" height="64">
</div>
## Resources
- Live preview: <https://themesberg.github.io/flowbite-astro-admin-dashboard/>
- Flowbite documentation: <https://flowbite.com/docs/getting-started/introduction/>
- Tailwind CSS documentation: <https://tailwindcss.com/>
- License Agreement: <https://flowbite.com/docs/getting-started/license/>
- Issues: [Github Issues Page](https://github.com/themesberg/flowbite-admin-dashboard/issues)
### JavaScript Frameworks
Here's a list of compatible technologies and guides for Flowbite and Tailwind CSS:
The awesome open-source community also built and currently maintains the following standalone libraries for React, Vue, Svelte, and Angular:
- [🌀 Flowbite React Library](https://github.com/themesberg/flowbite-react)
- [🍀 Flowbite Vue Library](https://github.com/themesberg/flowbite-vue)
- [🎸 Flowbite Svelte Library](https://github.com/themesberg/flowbite-svelte)
- [📕 Flowbite Angular Library](https://github.com/themesberg/flowbite-angular)
We also wrote integration guides for the following front-end frameworks and libraries:
- [📝 Flowbite with React guide](https://flowbite.com/docs/getting-started/react/)
- [📝 Flowbite with Next.js guide](https://flowbite.com/docs/getting-started/next-js/)
- [📝 Flowbite with Vue guide](https://flowbite.com/docs/getting-started/vue/)
- [📝 Flowbite with Nuxt.js guide](https://flowbite.com/docs/getting-started/nuxt-js/)
- [📝 Flowbite with Svelte guide](https://flowbite.com/docs/getting-started/svelte/)
### Back-end Frameworks
Flowbite has a great integration with most of the back-end frameworks because it relies on vanilla JavaScript:
- [📚 Using Flowbite with Laravel](https://flowbite.com/docs/getting-started/laravel/)
- [🚊 Using Flowbite with Ruby on Rails 7](https://flowbite.com/docs/getting-started/rails/)
- [🐸 Using Flowbite with Django](https://flowbite.com/docs/getting-started/django/)
- [🌶 Using Flowbite with Flask](https://flowbite.com/docs/getting-started/flask/)
## Reporting Issues
We use GitHub Issues as the official bug tracker for Flowbite Admin Dashboard. Here are some advices for our users that want to report an issue:
1. Make sure that you are using the latest version of Flowbite Admin Dashboard. Check the CHANGELOG from your dashboard on the [GitHub releases page](https://github.com/themesberg/flowbite-admin-dashboard/releases).
2. Providing us reproducible steps for the issue will shorten the time it takes for it to be fixed.
3. Some issues may be browser specific, so specifying in what browser you encountered the issue might help.
## Technical Support or Questions
If you have questions or need help integrating the product please [contact us](https://flowbite.com/contact/) instead of opening an issue.
## Licensing
- Copyright 2019-2023 Bergside Inc. (https://flowbite.com)
- Open-source under the [MIT License](https://github.com/themesberg/flowbite-admin-dashboard/blob/main/LICENSE)
## Useful Links
- 📚 [Flowbite Library](https://flowbite.com/) - Open-source components built with Tailwind CSS
- 🎨 [Flowbite Figma](https://flowbite.com/figma/) - Design system built for Figma
- 🧱 [Flowbite Blocks](https://flowbite.com/blocks/) - Building sections for website and applications
- 💎 [Flowbite Pro](https://flowbite.com/pro/) - A larger collection of the open-source version of the latter three
## Authors
- [Julian Cataldo](https://twitter.com/Julian_Cataldo)
- [Zoltán Szőgyényi](https://twitter.com/zoltanszogyenyi)
- [Robert Tanislav](https://twitter.com/roberttanislav)
Explore similar templates
Compare previews and descriptions within the same stack and category.
AdminLTE
AdminLTE is a free, open-source admin dashboard template built on Bootstrap 5 and vanilla JavaScript, with no jQuery dependency.
Astro · Admin dashboard
accessible-astro-dashboard
An accessibility-focused Astro admin template with a login page, dashboard overview, and example pages for media, messages, products, settings, and users. It includes SkipLinks, keyboard-operable sidebar navigation, dark mode, and localStorage-based preferences, with Accessible Astro Components and Astro Icon preinstalled.
Astro · Admin dashboard
bootstrap-admin-template
AsteroAdmin is a responsive admin template built with Astro and Bootstrap 5.3.3, offering light and dark themes, RTL support, and multiple dashboard layouts. It provides an analytics dashboard, compact sidebar, offcanvas navigation, and examples of charts, tables, and forms.
Astro · Admin dashboard
accessible-astro-docs
Official documentation site for the Accessible Astro projects, built with Astro's Starlight theme. It documents the Starter, Components, and Dashboard accessibility tools, with component descriptions, interactive examples, code snippets, accessibility guidelines, and TypeScript examples.
Astro · Admin dashboard
astro-blog
An Astro 6 blog template with a browser admin panel available only in development, where you write and publish MDX posts with autosave, component insertion, image upload, and live preview.
Astro · Admin dashboard
n8n-stats
n8n Pulse is an Astro-based static dashboard for the n8n community, aggregating templates, nodes, creators, discussions, events, and developer metrics from multiple APIs.
Astro · Admin dashboard