How to Create a Custom Drupal 11 Theme with Tailwind CSS 4.1

Staff Reporter

Serhii Shevchyk presents a technical walkthrough for integrating Tailwind CSS 4.1 into a custom Drupal 11 theme using DDEV. The guide is aimed at frontend developers and site builders who want modern styling in a fully decoupled yet Drupal-native approach.

The tutorial begins with Drupal’s Starterkit tool to scaffold a custom theme, then proceeds to install Tailwind CSS and configure PostCSS for efficient compilation. Tailwind’s new structure in version 4.1 simplifies setup, and the author details each folder, script, and configuration step needed to make it work within Drupal’s theme system. Special attention is given to the file structure, theme library integration, and enabling auto-recompilation during development.

Serhii emphasises clean separation of concerns: keeping source files modular, using watch scripts for rapid iteration, and attaching compiled CSS to the base library for site-wide coverage. The post ends with a simple test using Tailwind utility classes in a Twig template, validating that the setup is complete. This guide offers a focused path for developers integrating modern CSS workflows into Drupal core theming.

Reference: How to Set Up a Custom Drupal 11 Theme with Tailwind CSS 4 by Serhii Shevchyk (25 December 2025)

Tailwind CSS

Frontend

DDEV

Theming

Drupal 11

Disclosure: This content is produced with the assistance of AI.

Disclaimer: The opinions expressed in this story do not necessarily represent that of TheDropTimes. We regularly share third-party blog posts that feature Drupal in good faith. TDT recommends Reader's discretion while consuming such content, as the veracity/authenticity of the story depends on the blogger and their motives.

Note: The vision of this web portal is to help promote news and stories around the Drupal community and promote and celebrate the people and organizations in the community. We strive to create and distribute our content based on these content policy. If you see any omission/variation on this please reach out to us at #thedroptimes channel on Drupal Slack and we will try to address the issue as best we can.