Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

timonweb/django-tailwind

Repository files navigation

Tailwind CSS integration for Django a.k.a. Django + Tailwind = πŸ’š

Tests PyPI GitHub Python versions Downloads Downloads / Month

Django Tailwind Demo

Goal

This project provides a convenient way to integrate the Tailwind CSS framework into a Django project. It creates a new Django app (named theme by default) that includes all the necessary files and configurations to get started with Tailwind CSS quickly.

Features

  • An opinionated Tailwind CSS setup that makes your life easier;
  • Hot reloading of CSS, configuration files, and Django templates. No more manual page refreshes!
  • Out of the box support for CSS imports, Sass-like variables, and nesting;
  • Supports the latest Tailwind CSS v4.x;
  • Start both Tailwind CSS and Django development servers with a single command;
  • An optional DaisyUI integration to spice up your Tailwind templates with pre-built components.
  • A convenient management command for installing Tailwind CSS plugins;

Requirements

Python 3.10 or newer and Django 4.2.20 or newer.

Documentation

The full documentation is at https://django-tailwind.readthedocs.io/ or in the docs directory of this repository.

Getting Started

  1. Install django-tailwind:

    pip install django-tailwind
  2. Add to INSTALLED_APPS in settings.py:

    INSTALLED_APPS = [
     # ...
     'tailwind',
    ]
  3. Create Tailwind app:

    python manage.py tailwind init
  4. Add the generated app to INSTALLED_APPS and configure:

    INSTALLED_APPS = [
     # ...
     'tailwind',
     'theme', # your generated app name
    ]
    TAILWIND_APP_NAME = 'theme'
  5. Install Tailwind CSS dependencies:

    python manage.py tailwind install
  6. Start development (runs Django + Tailwind):

    python manage.py tailwind dev
  7. Use Tailwind classes in your templates:

    {% load tailwind_tags %}
    <link href="{% tailwind_css %}" rel="stylesheet">
    <h1 class="text-4xl font-bold text-blue-600">Hello Tailwind!</h1>

That's it! πŸŽ‰ Your Django project now has Tailwind CSS installed and ready to use.

For configuring automatic page reloads during development, see the Installation instructions.

Bugs and suggestions

Please see CONTRIBUTING.

2019 - 2025 (c) Tim Kamanin - A Full Stack Django and Wagtail Developer

AltStyle γ«γ‚ˆγ£γ¦ε€‰ζ›γ•γ‚ŒγŸγƒšγƒΌγ‚Έ (->γ‚ͺγƒͺγ‚ΈγƒŠγƒ«) /