Installation

Add wdj to a Django project in four steps.

1. Install the package
```
pip install -e .
```

2. Register the app

INSTALLED_APPS = [
    ...,
    "django_htmx",
    "wdj",
]

MIDDLEWARE = [
    ...,
    "django_htmx.middleware.HtmxMiddleware",
]

3. Collect the assets

The package ships prebuilt CSS, vendored htmx/Alpine/Lucide and compiled icon SVGs, so a normal static build is enough:
```
python manage.py collectstatic
```
To customise the design tokens, rebuild the stylesheet from assets/css/wdj.css with Tailwind CSS v4 (npm run css:build in this repository). Node is only needed by contributors, never at runtime.

4. Load it in your base template

{% load static %}
<link rel="stylesheet" href="{% static 'wdj/css/wdj.css' %}">
<script src="{% static 'wdj/vendor/htmx/htmx.min.js' %}" defer></script>
<script src="{% static 'wdj/js/wdj.js' %}" defer></script>

Usage

Component templates are loaded with {% load wdj %}. Simple content uses include; rich HTML slots use the wdj_component block tag:

{% wdj_component "wdj/components/card.html" title="Hello" %}
  <p>Rich <strong>body</strong> content.</p>
{% endwdj_component %}

Independence

wdj is an independent, community project. It is not affiliated with, endorsed by, or connected to Cloudflare. Kumo is a Cloudflare design system; wdj is an independent reimplementation of its visual language for Django.

1. Install the package

2. Register the app

3. Collect the assets

4. Load it in your base template