Flask HTML CSS Template - Soft UI Dashboard

This article presents an open-source Flask HTML CSS Template generated by AppSeed on top of Soft UI Dashboard, a modern Bootstrap 5 design from Creative-Tim. For newcomers, Flask is a modern and super-popular Python web framework use to prototype fast any web application and Soft UI is a modern and innovative Design System crafted by Creative Tim using Bootstrap 5 as core framework. The product can be downloaded directly from Github (without a registration lock) and used for hobby & commercial products.

Flask HTML CSS Template - VR Page.

Soft UI HTML Template

Designed for those who like bold elements and beautiful websites, Soft UI Dashboard is made of hundreds of elements, designed blocks, and fully coded pages.

Fully Coded Elements - Soft UI Dashboard comes with a reach UI KIT with over 70 frontend individual elements, like buttons, inputs, navbars, nav tabs, cards, alerts, giving you the freedom of choosing and combining. All components can take variations in color, that you can easily customize using SASS files and classes.

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

Soft UI HTML Template - Login Page
Flask HTML CSS Template - Login Page.
Soft UI HTML Page - Billing Page
Flask HTML CSS Template - Billing Page.

Flask Codebase

The project is more than a simple HTML template and comes with a simple set of features like authentication, database, helpers, and deployment scripts. Using this tested, development-ready seed project, any developer with basic programming knowledge should be able to bootstrap fast a new Flask project on top of a modern UI.

To make this article more useful, we can try to build the product using the institutions provided in the product documentation:

Step #1 - Clone/download the source code from Github

$ git clone https://github.com/app-generator/flask-soft-ui-dashboard.git
$ cd flask-soft-ui-dashboard
Flask HTML CSS Template - Download Sources

Step #2 - Install Dependencies using a Virtual Environment

$ # Virtualenv modules installation (Unix based systems)
$ virtualenv env
$ source env/bin/activate
$
$ # Install modules - SQLite Database
$ pip3 install -r requirements.txt
Flask HTML CSS Template - Install Dependencies

Step #3 - Set up the environment

$ # Set the FLASK_APP environment variable
$ (Unix/Mac) export FLASK_APP=run.py
$ (Windows) set FLASK_APP=run.py
$ (Powershell) $env:FLASK_APP = ".\run.py"
Flask HTML CSS Template - Configuration

Step #4 - Start the Flask Template

$ # Start the application (development mode)
$ flask run
Flask HTML CSS Template - Start App

To use the app, please access the registration page and create a new user. After authentication, the app will unlock the private pages.

Flask HTML CSS Template - User Profile Page.

Thanks for reading! For more Flask HTML templates please access: