Theming / 60+ shipped packs
A three-registry system that separates colors, design language, and the cohesive bundles of both. Switch packs per request; persist per user.
Pick from 60+ shipped packs (Dracula, Catppuccin, Nord, Tokyo Night, Vercel, Bauhaus, Cyberpunk), pair any preset with any design system, or author your own. Tokens flow through CSS custom properties so Tailwind utilities and your own CSS recolor the entire site without a rebuild.
What you get the moment you install djust — no theme code required, no per-component styling.
Dracula, Catppuccin, Nord, Tokyo Night, Vercel…
Every shipped pack defines a full light + dark token set, a design system (typography / animation / interaction), and integrates with the theme panel for runtime switching.
Read the guide →Drop-in mode + pack switcher.
A gear-icon dropdown with light/dark toggle and pack picker. Renders server-side so first paint is correct — no flash of wrong theme.
Read the guide →Two complete token sets per preset.
Mode flips a class on :root; the whole site recolors immediately. Packs with no separate dark variant auto-hide the toggle.
The levers between picking a shipped pack and authoring a full one — most projects only need the middle two.
Preset + DesignSystem + Pack, mix freely.
Pair a dracula preset with the editorial design system. The shipped packs are just curated combinations — you can build new ones without forking either.
Project-specific named knobs.
Per-pack custom variables for things the standard token set doesn't model — gutter widths, animation timings, accent variants. Mode-specific overrides supported.
Read the guide →set_active_pack(request, name).
Programmatic API for theme changes from any handler. Pairs with session persistence and the v0.9.0 cookie_namespace setting for multi-project isolation on shared domains.
Author your own packs, override individual tokens, integrate with Tailwind or Bootstrap — the system gets out of your way.
Bootstrap 4, Bootstrap 5, Tailwind, plain — pick one.
FormMixin and the built-in components delegate to a FrameworkAdapter that knows what classes to emit per framework. The Bootstrap bridge maps theme tokens onto .btn-primary / .form-control automatically — Bootstrap users get theme-aware Bootstrap for free.
Utilities that resolve through djust tokens.
Declare --color-brand-rust: hsl(var(--primary)) in @theme and Tailwind generates bg-brand-rust at build time — but the value stays runtime-dynamic.
One Python file, three exports.
PRESET + DESIGN_SYSTEM + PACK, registered in your apps.py:ready(). Mix with shipped design systems for less work.
The mistake worth avoiding.
Theme packs are for colors, type, motion — not for structural layout CSS. Putting layout rules in a pack means every pack has to redefine them. There's a page with the rule of thumb.
Read the guide →All eleven theming pages — settings reference, the full token vocabulary, CSS framework abstraction (Bootstrap 4 / 5, Tailwind, plain), Tailwind composition, authoring, runtime switching, recipes, and the troubleshooting catalog.