DEV Community

Cover image for Tailwind CSS - Open-Source Starters
Sm0ke
Sm0ke

Posted on • Originally published at blog.appseed.us

Tailwind CSS - Open-Source Starters

Hello Coders!

This article presents two open-source starters crafted on top of Tailwind CSS using Django and Flask as the backend frameworks. Products are released under the MIT license on Github and based on the permissive license, can be used in commercial or eLearning projects. Thanks for reading!


Soft Dashboard Tailwind CSS - Open-Source Starters


Soft Tailwind CSS Django

The product is shipped with authentication, Docker support, and a simple codebase fully documented here. Product Features:

  • ✅ CSS Framework: Tailwind
  • ✅ Up-to-date dependencies
  • ✅ Database: sqlite
  • ✅ UI-Ready app, Django Native ORM
  • ✅ Session-Based authentication, Forms validation

Probably the easier way to start the project in a local environment is to use the Docker setup shipped with the sources.

Step #1 - Clone the sources from the public repository

$ git clone https://github.com/app-generator/django-soft-dashboard-tailwind.git
$ cd django-soft-dashboard-tailwind
Enter fullscreen mode Exit fullscreen mode

Step #2 - Start in Docker

$ docker-compose up --build 
Enter fullscreen mode Exit fullscreen mode

Once the above commands are executed, the app should be up and running in the browser.

Soft Dashboard Tailwind CSS - Login Page


Soft Tailwind CSS Flask

This version comes with an identical features-set but for Flask:

  • ✅ CSS Framework: Tailwind
  • ✅ Up-to-date dependencies
  • ✅ Database: sqlite
  • ✅ DB Tools: SQLAlchemy ORM, Flask-Migrate (schema migrations)
  • ✅ Session-Based authentication (via flask_login), Forms validation

Soft Dashboard Tailwind CSS - Charts Page


✨ Design Presentation

Soft UI Dashboard Tailwind is built with over 70 frontend individual elements, like buttons, inputs, navbars, nav tabs, cards, or alerts, giving you the freedom of choosing and combining. All components can take variations in color, that you can easily modify using SASS files and classes.

👉 Soft UI Dashboard Tailwind - template version

This Free Tailwind CSS Dashboard is coming with prebuilt design blocks, so the development process is seamless, and switching from our pages to the real website is very easy to be done.

Sample Pages - If you want to get inspiration or just show something directly to your clients, you can jump-start your development with our pre-built example pages.


Soft Dashboard Tailwind - User Profile Page

Soft Dashboard Tailwind CSS - User Profile Page


Soft Dashboard Tailwind - Billing Page

Soft Dashboard Tailwind CSS - Billing Page


Soft Dashboard Tailwind - Data Tables

Soft Dashboard Tailwind CSS - UI Tables Page


Thanks for reading! For more resources, please access:

Discussion (5)

Collapse
crearesite profile image
WebsiteMarket

Thanks for sharing. I think the burger menu is not working on mobile.

Collapse
sm0ke profile image
Sm0ke Author

Ty! Noted.

Collapse
uithemes profile image
ui-themes

Great design and awesome (CSS) framework

Collapse
sm0ke profile image
Sm0ke Author

🚀🚀

Collapse
letswrite profile image
Let's Write

I have used daisyUI before, I think it is very good, and I recommend it.
daisyui.com/