Jinja Templates - Curated list
Tags: webdev, jinja, appseed
Published: 2020-08-08 04:32:39

---
title: Jinja Templates - Curated list
published: true
description: A curated list with Jinja Templates for your next Python projects
tags: webdev, jinja, appseed
cover_image: https://raw.githubusercontent.com/app-generator/jinja2-adminator/master/media/jinja2-adminator-screen.png
---
Hello coder, 

This article presents a curated list with **[Flask/Jinja Templates](https://appseed.us/admin-dashboards/flask)** that might help you build faster your next Python project. The free projects are released under the MIT License on Github and can be used for unlimited hobby & commercial projects. For support, feel free to access [AppSeed](https://appseed.us/), the company that creates the projects.

> *Thanks for reading!* - Content provided by **[App Generator](https://appseed.us/)**.

---

- ✨ [Flask/Jinja Datta Able](https://appseed.us/admin-dashboards/flask-datta-able) - free dashboard
- ✨ [Flask/Jinja Pixel Lite](https://appseed.us/apps/flask-apps/flask-pixel-bootstrap-uikit) - free UI Kit
- ✨ [Flask/Jinja Argon](https://appseed.us/admin-dashboards/flask-boilerplate-dashboard-argon) - free dashboard
- ✨ [Flask/Jinja Soft Dashboard](https://appseed.us/product/flask-soft-ui-dashboard) - free product
- ✨ [Flask/Jinja Black Dashboard](https://appseed.us/admin-dashboards/flask-dashboard-black) - free product

---

![Jinja Template - Black Design.](https://raw.githubusercontent.com/app-generator/jinja2-black-dashboard/master/media/jinja2-black-dashboard-intro.gif)

---

## [What is Jinja](https://docs.appseed.us/content/what-is/jinja)

Jinja2 is a Python template engine used to generate HTML or XML returned to the user via an HTTP response. 

For those who have not been exposed to a templating language before, such languages essentially contain variables as well as some programming logic, which when evaluated (or rendered into HTML) are replaced with actual values.

---

## Why do we need Jinja?

**Sandboxed Execution** - It provides a protected framework for automation of testing programs, whose behavior is unknown and must be investigated.

**HTML Escaping** Jinja 2 has a powerful automatic HTML Escaping, which helps to prevent Cross-site Scripting (XSS Attack). There are special characters like >,<,&, etc. which carry special meanings in the templates. So, if you want to use them as regular text in your documents then, replace them with entities. Not doing so might lead to XSS-Attack.

**Template Inheritance** - This feature helps us to generate new pages starting from a base template that we *inherit* a common structure. 

--- 

> How to get Jinja2

To start playing with it, just open a terminal and type:

```bash
$ pip install jinja2
```

---

## Jinja in action

> Simple runtime replace 

```python
>>> from jinja2 import Template
>>> t = Template("Hello {{ token }}!")
>>> t.render(token="Jinja2")
u'Hello Jinja2!'
```

The engine will replace the inner `token` with value `Jinja2`. This is quite useful when we use this block for different `token` values.

---

> Lists iteration

In web development, we can have cases when a list should be displayed on the page: registered users, for instance, or a simple list of options. In Jinja, we can use a `for structure` as bellow:

```python
# Define data structure
my_list=[0,1,2,3,4,5] # a simple list with integers
```

In Jinja, we can iterate with ease, using a `for` block:

```html
...
      <ul>
        {% for n in my_list %}
        <li>{{n}}</li>
        {% endfor %}
      </ul>
...
```

---

> Template Inheritance

Templates usually take advantage of inheritance, which includes a single base template that defines the basic structure of all subsequent child templates. You use the tags { extends } and { block } to implement inheritance.

Let's take a look at a real sample:

> Parent HTML - saved as `base.html`

```html
<html>
  <head>
    <title>My Jinja {% block title %}{% endblock %} </title>
  </head>
  <body>
    <div class="container">
      <h2>This is from the base template</h2>
      <br>
      { block content }{ endblock }
      <br>
    </div>
  </body>
</html>
```

> The Child template - saved as child.html

```html
{ extends "base.html" }

{ block title } MySample { endblock }

{ block content }
  Cool content here
{ endblock }
```

When Jinja loads `child.html`, the { extends } block informs the engine to merge the `base.html` template with the content provided by `child.html`

- `{ block title }` become `MySample`
- `{ block content }` become `Cool content here`

Here is the final HTML generated by Jinja:

```html
<html>
  <head>
    <title>My Jinja MySample</title>
  </head>
  <body>
    <div class="container">
      <h2>This is from the base template</h2>
      <br>
      Cool content here
      <br>
    </div>
  </body>
</html>
```

This powerful feature helps us to build complex web apps with ease by using common pages and components to generated dynamic pages hydrated with real information loaded from the database or provided by users, for instance. 

---

## [Jinja Template](https://github.com/app-generator/jinja-template) 

> Template features:

- UI Kit: [Argon Design](https://appseed.us/ui-kit/argon-design-system) (Free Version) by Creative-Tim
- Render Engine: Flask / [Jinja2](https://jinja.palletsprojects.com/)
- [MIT License](https://github.com/app-generator/license-mit)
- Free support via **Github** issues tracker

---

> UI Kit - [Argon Dashboard](https://www.creative-tim.com/product/argon-dashboard?AFFILIATE=128200) is built with over 100 individual components, giving you the freedom of choosing and combining. All components can take variations in color, that you can easily modify using SASS files. You will save a lot of time going from prototyping to full-functional code because all elements are implemented. This Dashboard is coming with pre-built examples, so the development process is seamless, switching from our pages to the real website is very easy to be done.

---

![Jinja Template - Argon Dashboard.](https://raw.githubusercontent.com/app-generator/jinja-template-argon-dashboard/master/media/jinja-template-argon-dashboard-screen.png)

---

## [Jinja Template](https://github.com/app-generator/jinja-template) - [Black Dashboard](https://appseed.us/black-dashboard)

> Template features:

- UI Kit: Black Dashboard (Free Version) by Creative-Tim
- Render Engine: Flask / [Jinja2](https://jinja.palletsprojects.com/)
- [MIT License](https://github.com/app-generator/license-mit)
- Free support via **Github** issues tracker

---

> UI Kit - [Black Dashboard](https://www.creative-tim.com/product/black-dashboard?AFFILIATE=128200)

*Vendor Notes* - **[Black Dashboard](https://www.creative-tim.com/product/black-dashboard?AFFILIATE=128200)** is a beautiful Bootstrap 4 Admin Dashboard with a huge number of components built to fit together and look amazing.
If you are looking for a tool to manage and visualize data about your business, this dashboard is the thing for you. It combines colors that are easy on the eye, spacious cards, beautiful typography, and graphics.
Black Dashboard comes packed with all plugins that you might need inside a project and documentation on how to get started. It is light and easy to use, and also very powerful.

---

![Jinja Template - Black Dashboard.](https://raw.githubusercontent.com/app-generator/jinja2-black-dashboard/master/media/jinja2-black-dashboard-screen.png)

---

## [Jinja Template](https://github.com/app-generator/jinja-template) - [AdminLTE](https://appseed.us/adminlte)

> Template features:

- UI Kit: [AdminLTE](https://appseed.us/adminlte) by ColorLib
- Render Engine: Flask / [Jinja2](https://jinja.palletsprojects.com/)
- [MIT License](https://github.com/app-generator/license-mit)
- Free support via **Github** issues tracker

---

> UI Kit - [AdminLTE](https://appseed.us/adminlte)

*Vendor Notes* - [AdminLTE](https://appseed.us/adminlte) is a fully responsive administration template. Based on Bootstrap 4.4 framework and also the JS/jQuery plugin. Highly customizable and easy to use. Fits many screen resolutions from small mobile devices to large desktops

---

![Jinja Template - AdminLTE.](https://raw.githubusercontent.com/app-generator/jinja2-adminlte/master/media/jinja2-adminlte-screen.png)

---

## [Jinja Template](https://github.com/app-generator/jinja-template) - Adminator

> Template features:

- UI Kit: Adminator (Free Version) by ColorLib
- Render Engine: Flask / [Jinja2](https://jinja.palletsprojects.com/)
- [MIT License](https://github.com/app-generator/license-mit)
- Free support via **Github** issues tracker

---

> UI Kit - [Adminator](https://colorlib.com/polygon/adminator/?ref=appseed)

*Vendor Notes* - Adminator is a responsive Bootstrap 4 Admin Template. It provides you with a collection of ready to use code snippets and utilities, custom pages, a collection of applications, and some useful widgets. The modern and clean UI makes this design a good candidate for your next project.

---

![Jinja Template - Adminator.](https://raw.githubusercontent.com/app-generator/jinja2-adminator/master/media/jinja2-adminator-screen.png)

---

## [Jinja Template](https://github.com/app-generator/jinja-template) - Quick UI

> Template features:

- UI Kit: Quick (Free Version) by Webpixels
- Render Engine: Flask / [Jinja2](https://jinja.palletsprojects.com/)
- [MIT License](https://github.com/app-generator/license-mit)
- Free support via **Github** issues tracker

---

> UI Kit - [Quick by Webpixels](https://webpixels.io/themes/quick-website-ui-kit/?ref=appseed)

*Vendor Notes* - The design of Quick is 100% responsive - it instantly adapts to all modern browsers and resolutions. You can now be sure you'll grab your users' attention with any of the pre-built page examples.
Plan, build, and launch beautiful and consistent user interfaces for the web that drives meaningful engagement and growth for your brand.

---

![Jinja Template - Quick UI.](https://raw.githubusercontent.com/app-generator/theme-jinja2-quick-uikit/master/media/theme-jinja2-quick-uikit-screen.png)

---

## [Jinja Template](https://github.com/app-generator/jinja-template) - [CoreUI](https://appseed.us/agency/coreui)

> Template features:

- UI Kit: CoreUI Dashboard (Free Version) by CoreUI - v3.2.0
- Render Engine: Flask / [Jinja2](https://jinja.palletsprojects.com/)
- [MIT License](https://github.com/app-generator/license-mit)
- Free support via **Github** issues tracker

---

> UI Kit - [CoreUI](https://appseed.us/agency/coreui)

*Vendor Notes* - [CoreUI](https://appseed.us/agency/coreui) is an Open Source Bootstrap Admin Template. But CoreUI is not just another Admin Template. 
It goes way beyond hitherto admin templates thanks to transparent code and file structure. 
And if that's not enough, let’s just add that CoreUI consists bunch of unique features and over 1000 high-quality icons.

CoreUI is meant to be the UX game changer. Pure & transparent code is devoid of redundant components, so the app is light enough to offer the ultimate user experience. This means mobile devices also, where the navigation is just as easy and intuitive as on a desktop or laptop. The CoreUI Layout API lets you customize your project for almost any device – be it Mobile, Web, or WebApp – CoreUI covers them all!

---

![Jinja Template - CoreUI.](https://raw.githubusercontent.com/app-generator/theme-jinja2-coreui/master/media/theme-jinja2-coreui-screen.png)

---

## [Jinja Template - Argon Dashboard PRO](https://theme-jinja2-argon-dashboard-pro.appseed.us/)

> Template features:

- UI Kit: Argon Dashboard PRO by Creative-Tim
- Render Engine: Flask / [Jinja2](https://jinja.palletsprojects.com/)
- Commercial License
- 24/7 Live Support via [Discord](https://discord.gg/fZC6hup).

---

> Used by

- [Flask Dashboard - Argon PRO](https://appseed.us/admin-dashboards/flask-dashboard-argon-pro)
- [Django Dashboard - Argon PRO](https://appseed.us/admin-dashboards/django-dashboard-argon-pro)

---

> UI Kit - [Argon Dashboard PRO](https://www.creative-tim.com/product/argon-dashboard-pro/?AFFILIATE=128200)

*Vendor Notes* - **Argon Dashboard PRO** is built with over 200 individual components, giving you the freedom of choosing and combining. 
All components can take variations in color, that you can easily modify using Sass files. You will save a lot of time going from prototyping to full-functional code because all elements are implemented. This Dashboard is coming with pre-built examples, so the development process is seamless, switching from our pages to the real website is very easy to be done. Every element has multiple states for colors, styles, hover, focus, that you can easily access and use.

---

![Jinja Template - Argon Dashboard PRO.](https://raw.githubusercontent.com/app-generator/theme-jinja2-argon-dashboard-pro/master/media/theme-jinja2-argon-dashboard-pro-screen.png)

---

## [Jinja2 Template - Material Dashboard PRO](https://theme-jinja2-material-dashboard-pro.appseed.us/)

> Template features:

- UI Kit: Material Dashboard PRO by Creative-Tim
- Render Engine: Flask / [Jinja2](https://jinja.palletsprojects.com/)
- Commercial License
- 24/7 Live Support via [Discord](https://discord.gg/fZC6hup).

> Used by

- [Flask Dashboard - Material PRO](https://appseed.us/admin-dashboards/flask-dashboard-material-pro)
- [Django Dashboard - Material PRO](https://appseed.us/admin-dashboards/django-dashboard-material-pro)

---

> UI Kit - [Material Dashboard PRO](https://www.creative-tim.com/product/material-dashboard-pro/?AFFILIATE=128200)

*Vendor Notes* - **[Material Dashboard PRO](https://www.creative-tim.com/product/material-dashboard-pro/?AFFILIATE=128200)** is a Premium Material Bootstrap 4 Admin with a fresh, new design inspired by Google's Material Design.
It is based on the popular Bootstrap 4 framework and comes packed with multiple third-party plugins.
All components are built to fit perfectly with each other while aligning with the material concepts.

--

![Jinja2 Theme - Material Dashboard PRO - Template project provided by AppSeed.](https://raw.githubusercontent.com/app-generator/theme-jinja2-material-dashboard-pro/master/media/theme-jinja2-material-dashboard-pro-screen.png)

---

## [Jinja Template - Black Dashboard PRO](https://theme-jinja2-black-dashboard-pro.appseed.us/)

> Template features:

- UI Kit: Black Dashboard PRO by Creative-Tim
- Render Engine: Flask / [Jinja2](https://jinja.palletsprojects.com/)
- Commercial License
- 24/7 Live Support via [Discord](https://discord.gg/fZC6hup).

---

> Used by

- [Flask Dashboard - Black PRO](https://appseed.us/admin-dashboards/flask-dashboard-black-pro)
- [Django Dashboard - Black PRO](https://appseed.us/admin-dashboards/django-dashboard-black-pro)

---

> UI Kit - [Black Dashboard PRO](https://themes.getbootstrap.com/product/black-dashboard-pro-premium-bootstrap-4-admin/)

*Vendor Notes* - Black Dashboard PRO is a beautiful Bootstrap 4 Admin Dashboard that comes in 2 versions: Dark and Light Mode. 
If you are looking for a tool to manage and visualize data about your business, this dashboard is the thing for you. It combines colors that are easy on the eye, spacious cards, beautiful typography, and graphics.

---

![Jinja Template - Black Dashboard PRO.](https://raw.githubusercontent.com/app-generator/theme-jinja2-black-dashboard-pro/master/media/theme-jinja2-black-dashboard-pro-screen.png)

---

## [Jinja Template - Material PRO Wpx](https://jinja2-material-dashboard-wpx-pro.appseed.us/)

> Template features:

- UI Kit: MaterialPro Dashboard (Premium Version) by WrapPixel
- Render Engine: Flask / [Jinja2](https://jinja.palletsprojects.com/)
- Commercial License
- 24/7 Live Support via [Discord](https://discord.gg/fZC6hup).

---

> Used by

- [Flask Dashboard - Material PRO Wpx](https://appseed.us/admin-dashboards/flask-material-dashboard-wpx-pro)
- [Django Dashboard - Material PRO Wpx](https://appseed.us/admin-dashboards/django-material-dashboard-wpx-pro)

---

> UI Kit - [MaterialPro Bootstrap Admin](https://www.wrappixel.com/templates/materialpro/?ref=appseed)

*Vendor Notes* - WrapPixel’s MaterialPro Bootstrap Admin is a premium bootstrap material design template that comes packed with new, fresh, and attractive designs and ready-to-use components. Based on the popular Bootstrap 4 framework and inspired by Google’s material design, the MaterialPro Bootstrap Admin template is bundled with multiple third-party plugins that make it an excellent standalone solution.

---

![Jinja Template - Material PRO Wpx.](https://raw.githubusercontent.com/app-generator/jinja2-material-dashboard-wpx-pro/master/media/jinja2-material-dashboard-wpx-pro-screen.png)

---

> Thanks for reading! For more Jinja Template or support please access the [AppSeed](https://appseed.us/) platform

---

### Links & resources

- More [Jinja Templates](https://github.com/app-generator/jinja-template) - provided by AppSeed