Команда разработчиков объявила о выходе версии 4.0 фреймворка Tailwind CSS.

Tailwind CSS v4.0 — это совершенно новая версия фреймворка, оптимизированная для производительности и гибкости, с переосмысленной конфигурацией и кастомизацией, а также использующая все преимущества последних достижений веб-платформ.

Новый высокопроизводительный движок, в котором полные сборки выполняются до 5 раз быстрее, а инкрементные сборки — более чем в 100 раз — и измеряются в микросекундах.
Разработано для современного Интернета — построено на передовых функциях CSS, таких как каскадные слои, зарегистрированные пользовательские свойства с помощью @propertyи color-mix().
Упрощенная установка — меньше зависимостей, отсутствие настроек и всего одна строка кода в CSS-файле.
Собственный плагин Vite — тесная интеграция для максимальной производительности и минимальной конфигурации.
Автоматическое определение содержимого — все файлы шаблонов обнаруживаются автоматически, без необходимости настройки.
Встроенная поддержка импорта — не требуется никаких дополнительных инструментов для объединения нескольких CSS-файлов.
CSSfirst конфигурация — переосмысленный опыт разработчика, в котором вы настраиваете и расширяете фреймворк непосредственно в CSS, а не в файле конфигурации JavaScript.
Переменные темCSS - все токены вашего дизайна отображаются как нативные переменные CSS, чтобы вы могли получить к ним доступ из любого места.
Динамические значения и варианты утилит - больше не нужно гадать, какие значения существуют в шкале интервалов, или расширять конфигурацию для таких вещей, как основные атрибуты данных.
Модернизированная цветовая палитра P3 - переработанная, более яркая цветовая палитра, которая в полной мере использует преимущества современных технологий отображения.
Контейнерные запросы - первоклассные API для стилизации элементов в зависимости от размера контейнера, плагины не требуются.
Новые утилиты 3D трансорфмаций - преобразуйте элементы в 3D пространстве прямо в вашем HTML.
Расширенные API градиентов - радиальные и конические градиенты, режимы интерполяции и многое другое.
Поддержка @starting-style - новый вариант, который вы можете использовать для создания переходов входа и выхода без необходимости использования JavaScript.
not-* вариант - стилизуйте элемент, только если он не соответствует другому варианту, пользовательскому селектору, медиа или запросу функции.
Еще больше новых утилит и вариантов, включая поддержку color-scheme, field-sizing, сложных теней, inert и многого другого.

Начните использовать Tailwind CSS v4.0 уже сегодня, установив его в новый проект или поиграв с ним прямо в браузере на Tailwind Play.

Для существующих проектов разработчики опубликовали подробное руководство по обновлению и создали инструмент автоматического обновления, чтобы вы могли как можно быстрее и безболезненно перейти на последнюю версию.

Релиз Tailwind CSS v4.0